.dev-tool-page .workbench { box-shadow:none; }
.dev-toolbar { display:flex; flex-wrap:wrap; align-items:end; gap:12px; margin-bottom:15px; padding:14px 16px; border:1px solid var(--border); border-radius:12px; background:var(--card); }
.dev-toolbar .field { min-width:170px; }
.dev-toolbar .field select { height:42px; }
.dev-toolbar .checkbox-field { display:flex; align-items:center; min-height:42px; padding:0 10px; color:var(--muted); font-size:12px; }
.dev-editor-grid textarea { min-height:390px; tab-size:2; }
.dev-editor-grid .field>span { display:flex; justify-content:space-between; gap:10px; }
.dev-editor-grid .field small { color:var(--muted); font-weight:400; }
.dev-stats { display:flex; min-height:45px; flex-wrap:wrap; align-items:center; gap:8px; margin-top:14px; padding:9px 12px; border:1px solid var(--border); border-radius:10px; background:var(--card); color:var(--muted); font-size:11px; }
.dev-stats span { padding:5px 9px; border-radius:7px; background:var(--primary-light); color:var(--primary); }
.feedback.is-success { color:#258360; }
.timestamp-now small { color:var(--muted); font:11px Consolas,monospace; }
.timestamp-converter-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.timestamp-converter-grid .workbench { display:flex; flex-direction:column; gap:15px; }
.timestamp-converter-grid h2 { margin:0; color:var(--text); font-size:16px; }
.timestamp-converter-grid .button { align-self:flex-start; }
.timestamp-result-grid { display:grid; gap:8px; margin-top:auto; }
.timestamp-result-grid>div { display:flex; flex-direction:column; gap:5px; padding:12px 14px; border:1px solid var(--border); border-radius:9px; background:#fbfbfd; }
.timestamp-result-grid span { color:var(--muted); font-size:10px; }
.timestamp-result-grid strong { overflow-wrap:anywhere; color:var(--text); font:700 12px/1.6 Consolas,"Microsoft YaHei",monospace; }
.regex-pattern-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:15px; }
.regex-flags { display:grid; gap:5px; padding-bottom:5px; color:var(--muted); font-size:11px; }
.regex-flags label { white-space:nowrap; }
.regex-summary { margin:14px 0 8px; color:var(--muted); font-size:12px; }
.regex-results { display:grid; gap:9px; }
.regex-match-card { overflow:hidden; border:1px solid var(--border); border-radius:10px; background:#fbfbfd; }
.regex-match-card>div { display:flex; justify-content:space-between; gap:12px; padding:9px 12px; border-bottom:1px solid var(--border); color:var(--muted); font-size:10px; }
.regex-match-card>div strong { color:var(--primary); }
.regex-match-card pre { overflow:auto; margin:0; padding:12px; color:var(--text); font:13px/1.6 Consolas,monospace; white-space:pre-wrap; }
.regex-match-card>small { display:block; padding:0 12px 11px; color:var(--muted); overflow-wrap:anywhere; }
.http-status-search { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:12px; }
.http-status-search .button { height:52px; }
.http-status-quick { display:flex; flex-wrap:wrap; gap:7px; margin:14px 0; }
.http-status-quick button { padding:6px 10px; border:1px solid var(--border); border-radius:7px; background:var(--card); color:var(--muted); cursor:pointer; font:11px Consolas,monospace; }
.http-status-quick button:hover { border-color:var(--primary); color:var(--primary); }
.http-status-card { display:flex; align-items:center; gap:18px; min-height:135px; padding:20px; border:1px solid var(--border); border-radius:12px; background:#fbfbfd; }
.http-status-number { display:grid; width:92px; height:72px; flex:none; place-items:center; border-radius:12px; background:var(--primary-light); color:var(--primary); font:800 25px Consolas,monospace; }
.http-status-number.status-2 { background:#e4f7ee; color:#25855d; }.http-status-number.status-3 { background:#e8f1ff; color:#3672bb; }.http-status-number.status-4 { background:#fff1db; color:#bb7424; }.http-status-number.status-5 { background:#ffe8eb; color:#c34758; }
.http-status-card strong { color:var(--text); font-size:16px; }.http-status-card p { margin:5px 0; color:var(--muted); }.http-status-card small { color:var(--muted); }
.dark .timestamp-result-grid>div,.dark .regex-match-card,.dark .http-status-card { background:#191a28; }
.uuid-output { display:grid; gap:8px; max-height:420px; overflow:auto; margin-bottom:14px; }
.uuid-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px; padding:10px 12px; border:1px solid var(--border); border-radius:9px; background:#fbfbfd; }
.uuid-row code { overflow:auto; color:var(--text); font:13px Consolas,monospace; white-space:nowrap; }
.uuid-row button { padding:6px 10px; border:1px solid var(--border); border-radius:7px; background:var(--card); color:var(--muted); cursor:pointer; font:11px inherit; }
.uuid-row button:hover { border-color:var(--primary); color:var(--primary); }
.jwt-warning { margin:14px 0; padding:10px 12px; border:1px solid #ead7a5; border-radius:9px; background:#fff9e9; color:#84692c; font-size:11px; }
.jwt-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.jwt-grid textarea { min-height:180px; }
.jwt-claims { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin-top:14px; }
.jwt-claims>div { display:flex; min-height:65px; flex-direction:column; justify-content:center; gap:4px; padding:10px 12px; border:1px solid var(--border); border-radius:9px; background:#fbfbfd; }
.jwt-claims span { color:var(--muted); font-size:10px; }.jwt-claims strong { overflow-wrap:anywhere; color:var(--text); font:700 11px/1.5 Consolas,"Microsoft YaHei",sans-serif; }
.dark .uuid-row,.dark .jwt-claims>div { background:#191a28; }.dark .jwt-warning { border-color:#5b4d2e; background:#302a1c; color:#e4d3a3; }
.text-stats-grid,.discount-result-grid,.contrast-checks { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:16px; }
.text-stats-grid>div,.discount-result-grid>div,.contrast-checks>div { display:flex; min-height:78px; flex-direction:column; justify-content:center; gap:6px; padding:12px; border:1px solid var(--border); border-radius:10px; background:#fbfbfd; }
.text-stats-grid span,.discount-result-grid span,.contrast-checks span { color:var(--muted); font-size:10px; }.text-stats-grid strong,.discount-result-grid strong,.contrast-checks strong { color:var(--text); font:700 18px Consolas,"Microsoft YaHei",sans-serif; }
.discount-result-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.countdown-panel { margin-top:16px; padding:22px; border:1px solid var(--border); border-radius:13px; background:linear-gradient(145deg,#f4f5ff,#f8fbff); text-align:center; }.countdown-panel>strong { color:var(--text); font-size:16px; }.countdown-panel p { margin:13px 0 0; color:var(--muted); font-size:11px; }.countdown-panel.is-past { background:linear-gradient(145deg,#fff2f0,#fff8f3); }.countdown-numbers { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:16px; }.countdown-numbers>div { display:flex; flex-direction:column; gap:4px; }.countdown-numbers strong { color:var(--primary); font:700 30px Consolas,monospace; }.countdown-numbers span { color:var(--muted); font-size:10px; }.contrast-controls { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.contrast-controls input[type=color] { width:100%; height:54px; padding:4px; cursor:pointer; }.contrast-preview { display:flex; min-height:165px; flex-direction:column; align-items:center; justify-content:center; gap:8px; margin-top:16px; border-radius:13px; text-align:center; }.contrast-preview strong { font-size:28px; }.contrast-preview span { font-size:14px; }.contrast-result { display:flex; align-items:center; gap:16px; margin-top:14px; padding:14px 16px; border:1px solid var(--border); border-radius:10px; background:var(--card); }.contrast-result strong { color:var(--text); font:700 24px Consolas,monospace; }.contrast-result span { color:var(--muted); font-size:12px; }.contrast-checks { grid-template-columns:repeat(4,minmax(0,1fr)); }.contrast-checks strong.pass { color:#258360; }.contrast-checks strong.fail { color:#c34758; }.dark .text-stats-grid>div,.dark .discount-result-grid>div,.dark .contrast-checks>div,.dark .countdown-panel { background:#191a28; }
@media(max-width:760px) { .timestamp-converter-grid,.regex-pattern-row,.http-status-search { grid-template-columns:1fr; } .dev-editor-grid textarea { min-height:280px; } .regex-flags { grid-template-columns:repeat(2,1fr); } .http-status-search .button { width:100%; } }
@media(max-width:760px) { .jwt-grid { grid-template-columns:1fr; }.jwt-claims { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:720px) { .text-stats-grid,.contrast-checks { grid-template-columns:repeat(2,minmax(0,1fr)); }.contrast-controls { grid-template-columns:1fr; } }
@media(max-width:460px) { .dev-toolbar { align-items:stretch; flex-direction:column; } .dev-toolbar .field { min-width:0; } .dev-toolbar .button { width:100%; } .timestamp-now { align-items:flex-start; flex-direction:column; } .http-status-card { align-items:flex-start; flex-direction:column; } .jwt-claims { grid-template-columns:1fr; }.discount-result-grid { grid-template-columns:1fr; }.countdown-numbers strong { font-size:22px; } }
.fun-intro { display:flex; flex-direction:column; gap:4px; margin-bottom:16px; padding:13px 15px; border:1px solid #edd9b4; border-radius:10px; background:linear-gradient(110deg,#fff8ec,#fff); }.fun-intro strong { color:var(--text); font-size:13px; }.fun-intro span { color:var(--muted); font-size:11px; }.fun-controls { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.truth-card { display:flex; min-height:210px; flex-direction:column; align-items:center; justify-content:center; gap:16px; margin-top:16px; padding:24px; border-radius:15px; background:linear-gradient(145deg,#5f5ba9,#3f477d); color:#fff; text-align:center; }.truth-card span { color:rgba(255,255,255,.72); font-size:12px; }.truth-card strong { max-width:620px; font-size:24px; line-height:1.5; }.emoji-card { display:flex; min-height:330px; flex-direction:column; align-items:center; justify-content:center; gap:17px; margin-top:14px; padding:22px; border:1px solid var(--border); border-radius:14px; background:var(--card); }.emoji-card #emoji-prompt { font-size:49px; letter-spacing:.1em; }.emoji-card .field { width:min(100%,460px); }.emoji-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }.emoji-card p { min-height:22px; margin:0; color:var(--muted); font-size:12px; }.lucky-number-display { display:grid; min-height:150px; place-items:center; margin:18px 0; border-radius:15px; background:radial-gradient(circle,#f4f0ff,#e9e9fb); color:var(--primary); font:800 48px Consolas,monospace; letter-spacing:.04em; }.name-report { min-height:180px; margin-top:16px; padding:20px; border:1px solid var(--border); border-radius:13px; background:linear-gradient(145deg,#fff8fb,#f7f7ff); }.name-report>strong { color:var(--text); font-size:22px; }.name-report p { color:var(--muted); font-size:12px; }.name-report small { color:var(--muted); }.name-report-metrics { display:flex; gap:10px; margin-top:14px; }.name-report-metrics span { padding:8px 12px; border-radius:8px; background:var(--primary-light); color:var(--muted); font-size:11px; }.name-report-metrics b { color:var(--primary); font:700 16px Consolas,monospace; }.mirror-output { min-height:110px; display:grid; place-items:center; margin-top:15px; padding:20px; border:1px solid var(--border); border-radius:12px; background:var(--card); color:var(--text); font-size:24px; text-align:center; overflow-wrap:anywhere; }.dark .fun-intro { border-color:#5b4930; background:linear-gradient(110deg,#30291f,#202131); }.dark .emoji-card,.dark .name-report { background:#191a28; }.dark .lucky-number-display { background:radial-gradient(circle,#343351,#242638); }
@media(max-width:650px) { .fun-controls { grid-template-columns:1fr; }.truth-card strong { font-size:18px; }.emoji-card #emoji-prompt { font-size:36px; }.name-report-metrics { flex-wrap:wrap; } }
.health-disclaimer { margin-bottom:16px; padding:11px 13px; border:1px solid #ead7a5; border-radius:9px; background:#fff9e9; color:#80642b; font-size:11px; line-height:1.65; }.health-result-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:16px; }.health-result-grid>div { display:flex; min-height:88px; flex-direction:column; justify-content:center; gap:7px; padding:12px; border:1px solid var(--border); border-radius:10px; background:#fbfbfd; }.health-result-grid span { color:var(--muted); font-size:10px; }.health-result-grid strong { overflow-wrap:anywhere; color:var(--text); font:700 13px/1.5 Consolas,"Microsoft YaHei",sans-serif; }.health-note { color:var(--muted); font-size:11px; }.health-highlight { margin-top:16px; padding:20px; border-radius:12px; background:linear-gradient(145deg,#edf7ff,#f4f3ff); color:var(--text); font-size:16px; line-height:1.7; }.sleep-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:16px; }.sleep-options>div { display:flex; min-height:92px; flex-direction:column; justify-content:center; gap:6px; padding:13px; border:1px solid var(--border); border-radius:10px; background:#fbfbfd; text-align:center; }.sleep-options strong { color:var(--primary); font:700 18px Consolas,monospace; }.sleep-options span { color:var(--muted); font-size:10px; }.dark .health-disclaimer { border-color:#5b4d2e; background:#302a1c; color:#e3d1a0; }.dark .health-highlight,.dark .health-result-grid>div,.dark .sleep-options>div { background:#191a28; }.dark .health-highlight { color:var(--text); }.health-result-grid strong { white-space:normal; }
@media(max-width:700px) { .health-result-grid,.sleep-options { grid-template-columns:1fr; }.health-result-grid>div { min-height:70px; }.sleep-options>div { min-height:72px; } }
.life-result-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:16px; }.life-result-grid>div { display:flex; min-height:82px; flex-direction:column; justify-content:center; gap:6px; padding:12px; border:1px solid var(--border); border-radius:10px; background:#fbfbfd; }.life-result-grid span { color:var(--muted); font-size:10px; }.life-result-grid strong { overflow-wrap:anywhere; color:var(--text); font:700 16px/1.45 Consolas,"Microsoft YaHei",sans-serif; }.life-highlight { margin-top:16px; padding:18px; border-radius:12px; background:linear-gradient(145deg,#eef8f5,#f4f3ff); color:var(--text); font-size:15px; line-height:1.7; }.password-score { display:flex; align-items:center; gap:14px; margin:16px 0 12px; padding:16px; border:1px solid var(--border); border-radius:11px; background:var(--card); }.password-score strong { color:var(--primary); font:700 26px Consolas,monospace; }.password-score span { color:var(--muted); font-size:13px; }.password-rules { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.password-rules div { padding:9px 11px; border:1px solid var(--border); border-radius:8px; color:var(--muted); font-size:11px; }.password-rules div::before { content:'○'; display:inline-block; width:20px; color:#bd7a2a; }.password-rules div.pass { border-color:#abd9c5; background:#effaf4; color:#258360; }.password-rules div.pass::before { content:'✓'; color:#258360; }.tracking-result { min-height:100px; margin-top:16px; padding:16px; border:1px solid var(--border); border-radius:11px; background:var(--card); }.tracking-result>strong { color:var(--text); font-size:14px; }.tracking-candidates { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }.tracking-candidates a { padding:7px 10px; border-radius:7px; background:var(--primary-light); color:var(--primary); font-size:11px; }.dark .life-result-grid>div,.dark .password-score,.dark .tracking-result { background:#191a28; }.dark .life-highlight { background:#191a28; }.password-rules div.pass { background:#1f362d; }
@media(max-width:700px) { .life-result-grid { grid-template-columns:1fr; }.password-rules { grid-template-columns:1fr; } }
.split-help { margin:0 0 16px; }.split-people-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }.split-people-toolbar strong { color:var(--text); font-size:14px; }.split-people-toolbar .action-row { margin:0; }.split-people-list { display:grid; gap:8px; }.split-person-row { display:grid; grid-template-columns:minmax(110px,1fr) minmax(150px,1fr) auto; align-items:center; gap:8px; }.split-person-row input { min-height:44px; padding:0 11px; border:1px solid var(--border); border-radius:9px; outline:0; background:#fbfbfd; color:var(--text); font:inherit; }.split-person-row input:focus { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-light); }.split-person-remove { min-height:44px; padding:0 11px; border:1px solid #efc4c7; border-radius:8px; background:#fff5f5; color:#c34758; cursor:pointer; font:12px inherit; }.split-person-remove:disabled { opacity:.35; cursor:not-allowed; }.split-fee-grid { margin-top:15px; }.split-summary { margin-top:15px; padding:12px 14px; border-radius:9px; background:var(--primary-light); color:var(--primary); font-size:11px; line-height:1.7; }.split-result-table { display:grid; gap:7px; margin-top:10px; }.split-result-row { display:grid; grid-template-columns:110px minmax(0,1fr) auto; align-items:center; gap:10px; padding:11px 12px; border:1px solid var(--border); border-radius:9px; background:#fbfbfd; }.split-result-row>span { color:var(--text); font-weight:700; }.split-result-row small { color:var(--muted); font-size:10px; }.split-result-row strong { color:var(--primary); font:700 15px Consolas,monospace; }.split-empty { padding:18px; border:1px dashed var(--border); border-radius:9px; color:var(--muted); font-size:11px; text-align:center; }.dark .split-person-row input,.dark .split-result-row { background:#191a28; }.dark .split-person-remove { border-color:#5b363b; background:#302022; }
@media(max-width:600px) { .split-people-toolbar { align-items:flex-start; flex-direction:column; }.split-person-row { grid-template-columns:1fr 1fr; }.split-person-remove { grid-column:1/-1; }.split-result-row { grid-template-columns:1fr auto; }.split-result-row small { grid-column:1/-1; grid-row:2; } }
.hash-output,.sql-output { overflow:auto; min-height:110px; margin-top:14px; padding:15px 16px; border:1px solid var(--border); border-radius:11px; background:#f7f8fb; color:var(--text); font:13px/1.7 Consolas,"Microsoft YaHei",monospace; white-space:pre-wrap; overflow-wrap:anywhere; }
.hash-output { letter-spacing:.04em; }
.sql-output { width:100%; resize:vertical; outline:0; }
.sql-output:focus { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-light); }
.cron-next { margin-top:16px; padding:14px 16px; border:1px solid #cbdaf5; border-radius:11px; background:#f3f7ff; color:#35609a; font-size:12px; line-height:1.7; }
.cron-fields { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:9px; margin-top:12px; }
.cron-fields>div { display:flex; min-height:82px; flex-direction:column; justify-content:center; gap:7px; padding:12px; border:1px solid var(--border); border-radius:10px; background:#fbfbfd; }
.cron-fields strong { color:var(--muted); font-size:10px; font-weight:600; }
.cron-fields span { overflow-wrap:anywhere; color:var(--primary); font:700 15px Consolas,monospace; }
.dark .hash-output,.dark .sql-output,.dark .cron-fields>div { background:#191a28; }
.dark .cron-next { border-color:#384a6a; background:#20283a; color:#b9cbed; }
@media(max-width:760px) { .cron-fields { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:460px) { .cron-fields { grid-template-columns:repeat(2,minmax(0,1fr)); } .hash-output,.sql-output { font-size:12px; } }
.palette-toolbar { align-items:end; }.palette-toolbar input[type=color],.design-control-grid input[type=color] { width:100%; min-height:42px; padding:4px; cursor:pointer; }.palette-swatches { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin:16px 0; }.palette-swatch { display:flex; min-height:128px; flex-direction:column; justify-content:flex-end; gap:4px; padding:12px; border:0; border-radius:11px; color:#fff; cursor:pointer; text-align:left; box-shadow:inset 0 -50px 35px rgba(0,0,0,.22); }.palette-swatch strong { font:700 12px Consolas,monospace; }.palette-swatch span { font-size:10px; opacity:.85; }.design-control-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }.design-control-grid .field { gap:7px; }.design-control-grid .field span { display:flex; justify-content:space-between; }.design-control-grid input[type=range] { width:100%; accent-color:var(--primary); }.shadow-preview { display:grid; min-height:220px; place-items:center; margin-top:18px; border:1px solid var(--border); border-radius:13px; background:#f7f8fb; }.shadow-preview>div { display:grid; width:min(80%,320px); min-height:100px; place-items:center; border-radius:16px; background:#fff; box-shadow:var(--shadow-value); color:#555; font-weight:700; }.design-code-row { display:flex; align-items:center; gap:12px; margin-top:14px; }.design-code-row code { flex:1; overflow:auto; padding:12px; border:1px solid var(--border); border-radius:9px; background:#f7f8fb; color:var(--text); font:12px/1.5 Consolas,monospace; white-space:nowrap; }.radius-preview { display:grid; min-height:200px; place-items:center; margin-top:18px; border:1px solid var(--border); background:#f0efff; color:var(--primary); }.radius-preview span { display:grid; width:min(75%,340px); min-height:100px; place-items:center; border:2px dashed #8f8bda; background:#fff; color:var(--text); }.type-scale-table { display:grid; gap:7px; margin-top:16px; }.type-scale-row { display:grid; grid-template-columns:1fr 80px 100px; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--border); border-radius:8px; background:#fbfbfd; }.type-scale-row span { color:var(--muted); font:11px Consolas,monospace; }.type-scale-row strong { color:var(--text); }.type-scale-row code { color:var(--primary); font:12px Consolas,monospace; }.design-code-output { width:100%; min-height:100px; margin-top:14px; padding:13px; border:1px solid var(--border); border-radius:10px; resize:vertical; background:#f7f8fb; color:var(--text); font:12px/1.6 Consolas,monospace; }.pattern-preview { display:flex; min-height:220px; flex-direction:column; align-items:center; justify-content:center; gap:6px; margin-top:18px; border:1px solid var(--border); border-radius:13px; color:#30303f; text-align:center; }.pattern-preview strong { font-size:24px; }.pattern-preview span { font-size:11px; }.dark .shadow-preview,.dark .design-code-row code,.dark .type-scale-row,.dark .design-code-output { background:#191a28; }.dark .radius-preview { background:#252441; }.dark .radius-preview span { background:#303142; color:#fff; }.dark .pattern-preview { color:#fff; }
@media(max-width:700px) { .palette-swatches { grid-template-columns:repeat(3,minmax(0,1fr)); }.design-control-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:460px) { .palette-swatches { grid-template-columns:repeat(2,minmax(0,1fr)); }.design-control-grid { grid-template-columns:1fr; }.design-code-row { align-items:stretch; flex-direction:column; }.type-scale-row { grid-template-columns:1fr 55px 75px; }.type-scale-row strong { font-size:18px !important; } }