:root{color:#1e2430;font-synthesis:none;--bg:#f4f6fb;--card:#fff;--line:#e3e7f0;--text:#1e2430;--muted:#6b7688;--accent:#3b5bdb;--accent2:#6741d9;--danger:#c0392b;--warn:#e8590c;background:#f4f6fb;font-family:system-ui,Microsoft YaHei,PingFang SC,sans-serif}*{box-sizing:border-box}html,body,#app{min-width:0;min-height:100%;margin:0}body{overflow-x:hidden}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}input,select,textarea{color:var(--text)}a{color:inherit}.app-shell{min-height:100vh}.app-header{border-bottom:1px solid var(--line);background:#fff;justify-content:space-between;align-items:center;gap:16px;height:68px;padding:0 max(20px,50vw - 800px);display:flex}.app-header>div{white-space:nowrap;align-items:center;gap:10px;font-size:20px;display:flex}.brand-mark{background:var(--accent);color:#fff;border-radius:9px;place-items:center;width:32px;height:32px;font-weight:800;display:inline-grid}.version{color:var(--muted);border:1px solid var(--line);border-radius:10px;padding:2px 6px;font-size:12px}.app-header nav{align-items:center;gap:8px;display:flex}.app-header nav a{color:var(--muted);border-radius:8px;padding:10px 14px;text-decoration:none}.app-header nav a.router-link-active{color:var(--accent);background:#eaf0ff;font-weight:700}.main-grid{gap:20px;min-width:0;max-width:1600px;margin:22px auto;padding:0 20px 30px;display:grid}.panel{background:var(--card);border:1px solid var(--line);border-radius:14px;min-width:0;padding:20px;box-shadow:0 3px 14px #172b4d0a}.panel h2{margin:0 0 16px;font-size:20px}.panel h1{margin-top:0}.panel p{line-height:1.6}.mode-row,.button-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.mode-row{color:#384458;margin-bottom:16px}.mode-row label{align-items:center;gap:5px;display:flex}.upload-zones{gap:10px;margin-bottom:16px;display:grid}.drop-zone{text-align:center;cursor:pointer;background:#f8faff;border:2px dashed #bcc9e6;border-radius:11px;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-height:116px;padding:12px;display:flex}.drop-zone:focus,.drop-zone:hover{border-color:var(--accent);outline:none}.drop-zone span{color:var(--muted);font-size:13px}.drop-zone b{color:var(--accent);font-size:13px}.field{flex-direction:column;gap:6px;margin:10px 0;font-size:14px;font-weight:600;display:flex}.field-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.field input,.field textarea,.library-toolbar input,.library-toolbar select,.review-header input{background:#fff;border:1px solid #cbd4e3;border-radius:8px;outline:none;width:100%;min-width:0;padding:10px 11px}.field textarea{resize:vertical}.field input:focus,.field textarea:focus,.library-toolbar input:focus,.library-toolbar select:focus,.review-header input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #3b5bdb1b}.button{border:1px solid #0000;border-radius:8px;min-height:42px;padding:10px 14px;font-weight:700}.button.primary{color:#fff;background:var(--accent)}.button.secondary{color:#30415f;background:#eef1f7;border-color:#dce3ef}.button.danger{color:#fff;background:var(--danger)}.button.warning{color:#fff;background:var(--warn)}.button:hover:not(:disabled){filter:brightness(1.06)}.text-button{color:#9cc1ff;background:0 0;border:0;padding:8px;font-weight:700}.error-text{color:var(--danger);font-weight:600}.success-text{color:#137b46;font-weight:600}.muted{color:var(--muted)}.section-heading{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.section-heading span{color:var(--muted);font-size:14px}.library-toolbar{flex-wrap:wrap;align-items:center;gap:9px;margin-bottom:18px;display:flex}.library-toolbar input{flex:190px}.library-toolbar select{flex:0 150px;width:auto}.question-grid{grid-template-columns:repeat(auto-fill,minmax(146px,1fr));gap:14px;display:grid}.question-card{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:11px;min-width:0;overflow:hidden;box-shadow:0 2px 8px #172b4d0b}.question-card:hover,.question-card:focus{border-color:#8ea5ed;outline:none;box-shadow:0 4px 15px #172b4d18}.card-media{aspect-ratio:3/4;background:#f1f3f8;place-items:center;display:grid;position:relative}.card-media img{object-fit:contain;width:100%;height:100%}.no-photo{color:var(--muted);font-size:13px}.wrong-badge,.answer-badge{color:#fff;border-radius:12px;padding:4px 7px;font-size:11px;font-weight:700;position:absolute;top:8px}.wrong-badge{background:var(--warn);left:8px}.answer-badge{background:#0f9d58;right:8px}.card-content{padding:9px}.card-question{-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0 0 8px;font-size:13px;line-height:1.4;display:-webkit-box;overflow:hidden}.chips{flex-wrap:wrap;gap:5px;display:flex}.chip{text-overflow:ellipsis;white-space:nowrap;max-width:100%;color:var(--accent);background:#eaf0ff;border-radius:12px;padding:4px 7px;font-size:11px;font-weight:700;display:inline-block;overflow:hidden}.chip.alt{color:var(--accent2);background:#f0eaff}.chip.count{color:var(--muted);background:#eef1f6}.card-actions{justify-content:space-between;margin-top:7px;display:flex}.card-actions button{color:var(--accent);background:0 0;border:0;padding:4px 2px;font-size:12px}.card-actions .danger-text{color:var(--danger)}.state-box{min-height:180px;color:var(--muted);text-align:center;background:#fbfcff;border:1px dashed #cad3e3;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;margin:16px 0;padding:22px;display:flex}.state-box strong{color:var(--text);font-size:18px}.state-box p{margin:8px 0}.state-box.error-state strong{color:var(--danger)}.state-box.startup{max-width:700px;margin:30px auto}.more-row{text-align:center;margin-top:18px}.settings-layout,.migration-layout{gap:20px;max-width:900px;margin:24px auto;padding:0 20px 30px;display:grid}.modal-backdrop{z-index:100;background:#101827ab;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal-box{background:#fff;border-radius:14px;width:min(620px,100%);max-height:min(92vh,800px);padding:22px;overflow-y:auto;box-shadow:0 20px 80px #0005}.modal-box h2{margin:0 0 12px}.modal-actions{flex-wrap:wrap;justify-content:flex-end;gap:10px;margin-top:20px;display:flex}.edit-fields{max-height:60vh;padding-right:4px;overflow-y:auto}.review-screen{z-index:80;color:#edf3ff;background:#111a2c;flex-direction:column;display:flex;position:fixed;inset:0;overflow:hidden}.review-header{background:#1a2941;flex-wrap:wrap;flex:none;align-items:center;gap:10px;padding:12px 16px;display:flex}.review-header>label{color:#b5c7e2;align-items:center;gap:7px;font-size:12px;display:flex}.review-header input{width:120px;padding:8px}.review-header>.button{margin-left:auto}.review-count{color:#ffc89d;font-weight:700}.review-feedback{color:#79d6a4;font-size:12px}.review-body{flex:1;grid-template-columns:minmax(0,1fr);gap:16px;min-height:0;padding:16px;display:grid;overflow:auto}.review-question,.answer-panel,.review-info{background:#1c2940;border:1px solid #34435a;border-radius:12px;min-width:0;padding:14px}.review-question h2,.answer-panel h3,.review-info h3{margin:0 0 12px;font-size:17px}.review-pane-head{justify-content:space-between;align-items:center;display:flex}.review-pane-head h2{margin:0}.question-text,.answer-text{white-space:pre-wrap;line-height:1.7}.answer-panel .muted,.review-info .muted{color:#a9b5c8}.image-stack{flex-direction:column;align-items:center;gap:12px;min-width:0;display:flex}.image-stack img{object-fit:contain;background:#fff;border-radius:6px;max-width:100%;max-height:75vh;display:block}.answer-hidden{text-align:center;padding:40px 16px}.review-actions{padding:10px 16px max(10px, env(safe-area-inset-bottom));background:#1a2941;flex:none;justify-content:center;gap:9px;display:flex}.review-actions .button{min-width:100px}.review-info,.mobile-nav,.mobile-photo-actions{display:none}.photo-preview{gap:8px;margin:12px 0;display:grid}.photo-preview-item{border:1px solid var(--line);border-radius:8px;align-items:center;gap:5px;min-width:0;padding:6px;display:flex}.photo-preview-item img{object-fit:contain;flex:none;width:48px;height:48px}.photo-preview-item .photo-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:12px;overflow:hidden}.photo-preview-item .button{min-height:36px;padding:5px 7px;font-size:12px}.sync-passphrase{flex:200px}.sync-logs{border:1px solid var(--line);background:#f8faff;border-radius:8px;max-height:220px;margin:10px 0;padding:8px 12px;font-size:12px;overflow-y:auto}.edit-image-list{gap:6px;margin:12px 0;display:grid}@media (width<=767px){.app-shell{padding-bottom:calc(64px + env(safe-area-inset-bottom))}.mobile-photo-actions{margin-bottom:14px;display:flex}.mobile-nav{z-index:50;padding:6px 8px max(6px, env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff;grid-template-columns:repeat(4,1fr);gap:4px;display:grid;position:fixed;bottom:0;left:0;right:0}.mobile-nav button,.mobile-nav a{color:var(--text);background:0 0;border:0;border-radius:8px;place-items:center;min-height:46px;font-size:13px;font-weight:700;text-decoration:none;display:grid}.mobile-nav .mobile-nav-add{background:var(--accent);color:#fff}.photo-preview-item{flex-wrap:wrap}.app-header{height:58px;padding:0 12px}.app-header>div{gap:6px;font-size:16px}.app-header nav a{padding:8px 9px;font-size:13px}.main-grid,.settings-layout,.migration-layout{gap:12px;margin:12px auto;padding:0 10px 20px}.panel{padding:14px}.field-grid{grid-template-columns:1fr;gap:0}.question-grid{grid-template-columns:repeat(auto-fill,minmax(126px,1fr));gap:9px}.review-header{gap:6px;padding:8px}.review-header>label{flex:100%;grid-template-columns:70px minmax(0,1fr);display:grid}.review-header input{width:100%}.review-header>.button{margin-left:0}.review-body{gap:8px;padding:8px}.review-actions{padding:8px 8px max(8px, env(safe-area-inset-bottom));grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;display:grid}.review-actions .button{min-width:0;min-height:44px}}@media (width>=768px) and (width<=1023px){.main-grid{max-width:900px}.upload-zones{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1024px) and (width<=1279px){.main-grid{grid-template-columns:minmax(310px,36%) minmax(0,1fr)}.upload-panel{align-self:start;max-height:calc(100vh - 28px);position:sticky;top:14px;overflow-y:auto}.review-body{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1280px){.main-grid{grid-template-columns:minmax(350px,32%) minmax(0,1fr)}.upload-panel{align-self:start;max-height:calc(100vh - 28px);position:sticky;top:14px;overflow-y:auto}.review-body{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(190px,.36fr)}.review-info{display:block}}
