.twofa-tool-card{position:relative}.twofa-tool-card .field{display:flex;flex-direction:column;gap:8px}.twofa-tool-card .field-label{font-size:13px;font-weight:600;color:var(--app-text-muted)}.twofa-tool-card .field-input{width:100%;height:40px;border:1px solid var(--app-border);border-radius:12px;background:var(--app-surface-soft);color:var(--app-text);padding:0 12px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.twofa-tool-card .field-textarea{min-height:96px;height:auto;padding:10px 12px;resize:vertical;line-height:1.5}.twofa-tool-card .field-input:focus{border-color:color-mix(in srgb,var(--color-primary) 35%,var(--app-border));box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary) 14%,transparent)}.twofa-tool-card .ghost-btn{height:40px;border-radius:12px;border:1px solid var(--app-border);font-size:13px;font-weight:600;padding:0 12px;background:var(--app-surface);color:var(--app-text-muted);transition:background-color .2s ease,color .2s ease}.twofa-tool-card .ghost-btn:hover{background:color-mix(in srgb,var(--app-surface) 80%,#cbd5e1 20%)}.twofa-tool-card .reset-btn{width:100%}.twofa-tool-card .result-card{border:1px solid var(--app-border);border-radius:14px;background:var(--app-surface-soft);padding:16px;display:flex;align-items:center;justify-content:space-between;gap:16px}.twofa-tool-card .result-left{display:flex;align-items:center;gap:12px;flex:1;min-width:0}.twofa-tool-card .code-col{display:flex;flex-direction:column;gap:4px;min-width:0}.twofa-tool-card .ring-col{flex-shrink:0}.twofa-tool-card .result-label{font-size:12px;color:var(--app-text-muted);margin:0}.twofa-tool-card .result-value{margin:0;font-size:32px;line-height:1.1;letter-spacing:.08em;font-weight:800;color:var(--color-primary);font-variant-numeric:tabular-nums}.twofa-tool-card .copy-btn{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 16px;border-radius:6px;border:1px solid var(--app-border);background:var(--app-surface);color:var(--app-text);font-size:13px;font-weight:600;transition:background-color .2s ease,transform .1s ease}.twofa-tool-card .copy-btn:hover{background:color-mix(in srgb,var(--app-surface) 80%,#cbd5e1 20%)}.twofa-tool-card .copy-btn:active{transform:scale(.97)}.twofa-tool-card .ring-wrap{position:relative;width:72px;height:72px}.twofa-tool-card .progress-ring{width:100%;height:100%;transform:rotate(-90deg)}.twofa-tool-card .ring-bg{stroke:#e2e8f0}.twofa-tool-card .ring-fg{stroke:var(--color-primary);transition:stroke-dashoffset .9s linear}.twofa-tool-card .ring-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:var(--color-primary);font-variant-numeric:tabular-nums}.twofa-tool-card .twofa-toast{position:absolute;left:50%;bottom:24px;transform:translate(-50%,8px);padding:10px 18px;border-radius:10px;background:#111827eb;color:#fff;font-size:13px;font-weight:500;box-shadow:0 10px 25px #0000002e;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:20;white-space:nowrap}.twofa-tool-card .twofa-toast.show{opacity:1;transform:translate(-50%)}.twofa-tool-card .twofa-toast[data-type=error]{background:#be123cf2}.age-tool-card .field{display:flex;flex-direction:column;gap:8px}.age-tool-card .field-label{font-size:13px;font-weight:600;color:var(--app-text-muted)}.age-tool-card .control-rows{display:flex;flex-direction:column;gap:10px}.age-tool-card .control-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.age-tool-card .date-item{flex:0 0 auto}.age-tool-card .date-box{position:relative;display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 12px;border:1px solid var(--app-border);border-radius:10px;background:var(--app-surface-soft);cursor:pointer;user-select:none}.age-tool-card .date-display{font-size:14px;color:var(--app-text);white-space:nowrap;pointer-events:none}.age-tool-card .date-icon{color:var(--app-text-muted);flex-shrink:0;pointer-events:none}.age-tool-card .date-input-overlay{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:auto;cursor:pointer}.age-tool-card .actions-inline{display:flex;align-items:center;gap:6px;flex:0 0 auto}.age-tool-card .field-inline{flex-direction:row;align-items:center;gap:8px}.age-tool-card .field-inline .field-label{white-space:nowrap;flex-shrink:0}.age-tool-card .radio-group{display:flex;flex-wrap:nowrap;gap:6px}.age-tool-card .radio-item{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 10px;border:1px solid var(--app-border);border-radius:9999px;background:var(--app-surface-soft);color:var(--app-text-muted);font-size:12px;font-weight:600;cursor:pointer}.age-tool-card .radio-item input{accent-color:var(--app-primary)}.age-tool-card .field-input{width:100%;min-width:148px;height:36px;border:1px solid var(--app-border);border-radius:10px;background:var(--app-surface-soft);color:var(--app-text);padding:0 10px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.age-tool-card .field-input:focus{border-color:color-mix(in srgb,var(--app-primary) 35%,var(--app-border));box-shadow:0 0 0 3px color-mix(in srgb,var(--app-primary) 14%,transparent)}.age-tool-card .primary-btn,.age-tool-card .ghost-btn{height:34px;border-radius:10px;border:1px solid var(--app-border);font-size:12px;font-weight:600;padding:0 10px;transition:background-color .2s ease,color .2s ease}.age-tool-card .primary-btn{background:var(--app-primary);border-color:color-mix(in srgb,var(--app-primary) 80%,var(--app-border));color:#fff}.age-tool-card .primary-btn:hover{background:color-mix(in srgb,var(--app-primary) 88%,black 12%)}.age-tool-card .ghost-btn{background:var(--app-surface);color:var(--app-text-muted)}.age-tool-card .ghost-btn:hover{background:color-mix(in srgb,var(--app-surface) 80%,#cbd5e1 20%)}.age-tool-card .result-card{border:1px solid var(--app-border);border-radius:14px;background:var(--app-surface-soft);padding:14px;min-height:90px;display:flex;flex-direction:column;justify-content:center;gap:6px}.age-tool-card .result-card.compact{min-height:76px}.age-tool-card .result-label{font-size:12px;color:var(--app-text-muted);margin:0}.age-tool-card .result-value{font-size:20px;line-height:1.25;font-weight:700;color:var(--app-text);margin:0;word-break:break-word}
