:root{--paper: #efe8d8;--ink: #231c16;--muted: #6a5d4e;--line: #d4c9b4;--accent: #8f2d14;--wall: #161310;--lift: #f7f1e4;--ok: #3f5c2a;--serif: "Noto Serif TC", "Songti TC", serif;--sans: "Noto Sans TC", "PingFang TC", sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;background:var(--wall);color:var(--ink)}.app{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);grid-template-columns:minmax(0,1fr) min(292px,30vw);grid-template-areas:"top top" "view dock"}.app.is-gallery{grid-template-columns:minmax(0,1fr) min(340px,36vw)}.app:has(.toolstrip){grid-template-rows:auto auto minmax(0,1fr);grid-template-areas:"top top" "tools tools" "view dock"}.topbar{grid-area:top;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 20px;padding:10px 20px 12px;background:var(--wall);color:var(--paper);border-bottom:1px solid rgb(239 232 216 / .12)}.topbar h1{margin:0;font-family:var(--serif);font-size:20px;font-weight:700;letter-spacing:.04em}.topbar-meta{margin-left:auto;display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;font-size:13px;color:#efe8d89e}.text-btn{border:0;background:transparent;padding:0;font:inherit;color:inherit;cursor:pointer}.topbar .text-btn{color:#efe8d89e}.topbar .text-btn:hover{color:var(--paper)}.live{color:#c5d4b0}.offline{color:#d4a194}.stage-switch{display:flex;gap:4px}.stage-switch button{border:0;background:transparent;padding:4px 2px;font-family:var(--serif);font-size:15px;font-weight:700;color:#efe8d873;cursor:pointer}.stage-switch button.is-on{color:var(--paper);box-shadow:inset 0 -1px 0 var(--accent)}.toolstrip{grid-area:tools;display:flex;flex-wrap:wrap;gap:8px;padding:8px 20px 10px;background:var(--wall);border-bottom:1px solid rgb(239 232 216 / .1)}.chip{border:1px solid rgb(239 232 216 / .22);background:transparent;color:#efe8d8c7;font:13px var(--sans);padding:5px 12px;cursor:pointer}.chip.is-on{background:var(--paper);color:var(--ink);border-color:var(--paper)}.viewer-shell{grid-area:view;position:relative;min-width:0;min-height:0;height:100%}.viewer-shell.is-commenting{cursor:copy}.viewer-shell.is-drawing{cursor:crosshair}.osd,.overlay{position:absolute;top:0;right:0;bottom:0;left:0}.osd{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}.osd:active{cursor:grabbing}.viewer-shell.is-commenting .osd{cursor:copy}.viewer-shell.is-drawing .osd{cursor:crosshair}.hotspot{position:absolute;box-sizing:border-box;border:2px solid #3f6212;background:#3f62122e;pointer-events:none}.hotspot.is-draft{border-style:dashed;background:#9a341229;border-color:var(--accent)}.look-callout{--pointer-x: 50%;--pointer-y: 50%;position:absolute;z-index:3;padding:13px 15px 14px;border-radius:8px;background:var(--paper);color:var(--ink);box-shadow:0 12px 30px #1c171247;font-family:var(--sans);pointer-events:none}.look-callout strong{display:block;margin-bottom:5px;font-family:var(--serif);font-size:16px;line-height:1.4}.look-callout p{margin:0;color:var(--muted);font-size:14px;line-height:1.7}.look-callout:after{content:"";position:absolute;width:12px;height:12px;background:var(--paper);transform:rotate(45deg)}.look-callout.is-above:after{left:var(--pointer-x);bottom:-6px;margin-left:-6px}.look-callout.is-below:after{left:var(--pointer-x);top:-6px;margin-left:-6px}.look-callout.is-left:after{top:var(--pointer-y);right:-6px;margin-top:-6px}.look-callout.is-right:after{top:var(--pointer-y);left:-6px;margin-top:-6px}.overlay{pointer-events:none}.crosshair{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2}.crosshair:before,.crosshair:after{content:"";position:absolute;left:50%;top:50%;background:#9a3412;box-shadow:0 0 0 1px #fff8ee}.crosshair:before{width:22px;height:2px;transform:translate(-50%,-50%)}.crosshair:after{width:2px;height:22px;transform:translate(-50%,-50%)}.canvas-caption{position:absolute;left:50%;top:12px;z-index:3;transform:translate(-50%);margin:0;padding:6px 14px;background:var(--paper);font-size:13px;color:var(--ink);pointer-events:none;white-space:nowrap}.canvas-tools{position:absolute;left:50%;bottom:18px;z-index:4;transform:translate(-50%);display:flex;gap:8px}.canvas-btn{border:0;background:var(--accent);color:#fff8ee;font:500 14px var(--sans);padding:8px 18px;border-radius:2px;box-shadow:0 8px 18px #2a211847;cursor:pointer}.canvas-btn.is-quiet{background:var(--paper);color:var(--ink);border:1px solid var(--line);box-shadow:0 8px 18px #2a211829}.canvas-btn.is-on,.canvas-btn.is-quiet.is-on{background:#7f1d1d;color:#fff8ee;border-color:#7f1d1d}.note-composer{position:absolute;right:16px;bottom:16px;z-index:5;width:min(280px,calc(100% - 32px));display:grid;gap:8px;padding:12px;background:var(--paper);border:1px solid var(--line);box-shadow:0 12px 28px #2a211838}.note-composer textarea{width:100%;border:1px solid var(--line);border-radius:2px;padding:8px 10px;font:14px var(--sans);resize:vertical;background:#fffdf8}.note-composer-actions{display:flex;justify-content:flex-end;gap:8px}.note-composer-actions button,.note-kinds button{width:auto;border:1px solid var(--line);background:#fffdf8;padding:6px 12px;font:13px var(--sans);cursor:pointer}.note-kinds{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.note-kinds button.is-active,.note-composer-actions button[type=submit]{border:0;background:var(--accent);color:#fff8ee}.pin,.cursor,.note{position:absolute;transform:translate(-2px,-2px);pointer-events:none;white-space:nowrap}.pin-dot{display:block;width:12px;height:12px;border-radius:99px;background:var(--pin);box-shadow:0 0 0 2px #fff8ee}.pin-name,.cursor span{margin-left:4px;padding:1px 6px;border-radius:4px;background:#fff8ee;color:var(--ink);font-size:11px}.cursor{display:flex;align-items:center}.pin.is-correct .pin-dot{box-shadow:0 0 0 2px #fff8ee,0 0 0 5px #3f6212}.pin.is-wrong .pin-dot{box-shadow:0 0 0 2px #fff8ee,0 0 0 5px #9a3412;opacity:.7}.note{display:flex;align-items:flex-start;max-width:180px}.note-dot{flex:none;width:18px;height:18px;border-radius:99px;background:var(--pin, var(--accent));color:#fff8ee;font-size:10px;line-height:18px;text-align:center}.note-text{margin-left:4px;padding:2px 6px;border-radius:4px;background:#fff8ee;color:var(--ink);font-size:11px;white-space:normal}.note.is-pending .note-dot{background:var(--accent)}.note.is-speech{flex-direction:column;max-width:200px;transform:translate(-10px,calc(-100% - 4px))}.note.is-speech .note-text{margin:4px 0 0;padding:6px 8px;border-radius:10px 10px 10px 4px;font-family:var(--serif);font-size:13px;line-height:1.4;box-shadow:0 1px #3a2a181f}.dock{grid-area:dock;background:var(--paper);border-left:1px solid rgb(35 28 22 / .12);padding:20px 18px 28px;overflow:auto;font-family:var(--sans)}.dock-title{margin:20px 0 10px;font-family:var(--serif);font-size:16px;font-weight:700}.dock>.dock-title:first-child,.dock>.teacher-prep:first-child .dock-title{margin-top:0}.q-pager{display:flex;align-items:center;gap:10px;margin-bottom:16px;color:var(--muted);font-size:13px}.dock .q-pager button{width:auto;padding:2px 0;text-align:center;background:transparent;border:0}.dock .q-pager button:disabled{opacity:.35;cursor:default}.q-stem{margin:0 0 16px;font-family:var(--serif);font-size:22px;font-weight:700;line-height:1.45}.label-facts{margin:0 0 12px;font-size:12px;line-height:1.7;color:var(--muted)}.label-lead{margin:0 0 16px;font-family:var(--serif);font-size:15px;font-weight:500;line-height:1.85;color:var(--ink)}.look-full{margin:0 0 22px}.dock .look-full button{width:auto;padding:0 0 8px;border-bottom:1px solid var(--line);color:var(--muted)}.dock .look-full button.is-active{color:var(--accent);border-bottom-color:var(--accent)}.teacher-board{margin-top:28px}.dock ol{margin:0;padding:0;list-style:none;display:grid;gap:6px}.dock .prep-add{margin:0 0 12px}.dock button{width:100%;text-align:left;border:0;background:transparent;padding:9px 0;font:inherit;cursor:pointer}.dock .q-item>button{padding:10px 12px;background:var(--lift)}.dock .q-item>button.is-active,.q-item.is-open{background:var(--lift)}.q-item.is-open{outline:1px solid var(--line);overflow:hidden}.q-item.is-open>button{background:transparent}.dock button em{display:block;margin-top:4px;font-style:normal;font-size:12px;color:var(--muted)}.q-settings{display:grid;gap:8px;padding:0 12px 12px}.hint{font-size:13px;line-height:1.6;color:var(--muted)}.mark-box{display:grid;gap:8px;margin-top:10px}.dock button.mark-here{text-align:center;background:var(--accent);color:var(--paper);font-weight:500;padding:10px 12px}.dock button.mark-here.is-on{background:#6d2210}.class-switch{display:flex;align-items:center}.class-switch select{max-width:180px;border:0;border-bottom:1px solid rgb(239 232 216 / .28);padding:2px 0;font:inherit;color:inherit;background:transparent}.note-form,.note-kinds{display:grid;gap:8px}.note-kinds{grid-template-columns:1fr 1fr 1fr}.note-form textarea{width:100%;border:1px solid var(--line);padding:8px 10px;font:inherit;resize:vertical}.teacher-prep{display:grid;gap:10px}.prep-add{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:end}.prep-add input,.prep-edit input,.prep-add select,.painting-search,.answer-form input{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:8px 0;font:inherit;background:transparent}.dock .prep-add button{width:auto;background:var(--accent);color:var(--paper);padding:8px 12px}.prep-edit{display:grid;gap:6px;font-size:13px;color:var(--muted)}.teacher-prep .text-btn{width:auto;color:var(--muted);justify-self:start}.now-work{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:baseline}.now-title{margin:0;font-family:var(--serif);font-size:18px;font-weight:700}.now-meta{margin:0;grid-column:1;font-size:12px;color:var(--muted)}.now-work .text-btn{grid-column:2;grid-row:1}.painting-search{width:100%}.painting-pick{margin:0;padding:0;list-style:none;display:grid;gap:2px;max-height:28vh;overflow:auto}.painting-pick button{width:100%;text-align:left;padding:8px 0;display:grid;gap:2px}.painting-pick button strong{font-family:var(--serif);font-weight:700}.painting-pick button small{color:var(--muted);font-size:12px}.painting-pick button.is-on{color:var(--accent)}.painting-pick .pick-label{margin:10px 0 2px;font-size:12px;color:var(--muted)}.painting-pick .pick-empty{padding:8px 0;font-size:13px;color:var(--muted)}.upload-btn{display:block;text-align:center;border:1px dashed var(--line);padding:8px 12px;cursor:pointer;color:var(--muted);font-size:13px}.upload-btn.is-busy{opacity:.6;cursor:wait}.upload-btn input{display:none}.hint.is-error{color:#9f1239}.judge-list{margin:0;padding:0;list-style:none;display:grid;gap:10px}.judge-list li{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:13px}.judge-actions{display:flex;gap:8px}.judge-actions button{width:auto;padding:2px 0;font-size:12px;color:var(--muted)}.judge-actions button.is-on{color:var(--accent)}.verdict{margin:0;font-size:13px}.verdict.is-correct{color:var(--ok)}.verdict.is-wrong{color:var(--accent)}.class-pick{display:grid;gap:8px}.class-pick button{width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);background:transparent;padding:12px 0;font:inherit;cursor:pointer}.class-pick button em{display:block;margin-top:4px;font-style:normal;font-size:12px;color:var(--muted)}.answer-form{display:flex;gap:10px;margin-top:10px;align-items:end}.answer-form input{flex:1}.primary-btn,.answer-form button{border:0;background:var(--accent);color:var(--paper);padding:8px 16px;font:500 14px var(--sans);cursor:pointer}.answers{margin:16px 0 0;padding:0;list-style:none;font-size:13px;color:var(--muted)}.hall{min-height:100%;background:var(--paper);color:var(--ink);padding:0 0 56px}.hall-bar{position:sticky;top:0;z-index:20;margin:0 0 20px;padding:14px 28px 12px;background:var(--paper);border-bottom:1px solid var(--line)}.hall-bar-inner{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin:0 auto;max-width:1120px}.hall-brand{display:flex;align-items:center;gap:10px}.hall-brand-copy{display:grid;gap:2px}.brand-mark{display:block;flex-shrink:0;object-fit:contain;aspect-ratio:1}.gate-card .brand-mark{margin-bottom:10px}.hall-bar h1{margin:0;font-family:var(--serif);font-size:22px;font-weight:700;letter-spacing:.08em;white-space:nowrap}.hall-lead{margin:10px 0 0;max-width:36em;font-size:15px;line-height:1.75;color:var(--muted)}.hall-enter{margin-left:auto;border:0;background:transparent;padding:0;font:13px var(--sans);color:var(--muted);cursor:pointer;text-decoration:none}.hall.is-gate{display:grid;place-items:center;padding:24px}.gate-card{width:min(420px,100%)}.gate-card h1{margin:0 0 8px;font-family:var(--serif);font-size:36px;letter-spacing:.12em}.gate-back{display:inline-block;margin-top:24px;color:var(--muted)}.primary-btn{margin-top:20px;width:100%;padding:12px}.gallery-grid{margin:0 auto;padding:0 28px;max-width:1176px;list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:36px 20px}.gallery-grid>.is-wide{grid-column:span 2}.gallery-card{display:flex;flex-direction:column;width:100%;margin:0;padding:0;overflow:hidden;text-align:left;color:var(--ink);background:transparent;border:0;cursor:pointer}.gallery-thumb{display:block;height:148px;background:#3a3228 center / cover no-repeat}.gallery-card.is-hang .gallery-thumb{height:248px;background-position:top center}.gallery-card.is-wide .gallery-thumb{height:168px}.gallery-card.is-leaf .gallery-thumb{height:168px;background-position:center}.gallery-meta{display:grid;gap:2px;padding:12px 0 0}.gallery-meta strong{font-family:var(--serif);font-size:17px;font-weight:700}.gallery-meta em,.gallery-meta small{font-style:normal;font-size:12px;color:var(--muted)}.hall-enter:hover,.hall .text-btn:hover{color:var(--ink)}.catalog-empty{margin:48px auto;padding:0 28px;max-width:1120px;color:var(--muted)}.catalog-search{flex:1;min-width:180px;border:0;border-bottom:1px solid var(--ink);padding:6px 0 7px;background:transparent;font:14px var(--sans);color:var(--ink)}.catalog-search:focus{outline:none}.catalog-sort{display:flex;gap:14px}.catalog-sort button{border:0;background:transparent;padding:0 0 3px;font:13px var(--sans);color:var(--muted);cursor:pointer}.catalog-sort button.is-on{color:var(--ink);box-shadow:inset 0 -1px 0 var(--ink)}.facet-select select{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;border-bottom:1px solid var(--line);background-color:transparent;padding:0 1.15em 4px 0;font:13px var(--sans);color:var(--ink);cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 6px) calc(50% + 1px),calc(100% - 1px) calc(50% + 1px);background-size:5px 5px,5px 5px;background-repeat:no-repeat}.facet-select select:focus{outline:none;border-bottom-color:var(--ink)}.catalog-count{display:flex;align-items:baseline;gap:10px;margin:0;color:var(--muted);font-size:12px}.catalog-empty{margin:48px auto;color:var(--muted)}.gallery-card.is-object .gallery-thumb{height:200px;background-position:center}.object-record{display:grid;gap:9px;margin:0 0 22px}.object-record>div{display:grid;grid-template-columns:3em 1fr;gap:10px;align-items:start}.object-record dt{margin:0;font-size:11px;letter-spacing:.08em;color:var(--muted)}.object-record dd{margin:0;font-size:13px;line-height:1.65}.object-note{display:block;margin-top:2px;color:var(--muted);font-size:12px}.related-works{margin-top:28px}.related-works h2{margin:0 0 8px;color:var(--muted);font-size:12px;font-weight:500}.related-works ul{margin:0;padding:0;list-style:none}.look-groups{display:grid;gap:22px}.look-group h2{margin:0 0 8px;color:var(--muted);font-size:12px;font-weight:500}.look-list{margin:0}.dock .look-list button{padding:8px 0;border-bottom:1px solid var(--line);color:var(--ink)}.dock .look-list button.is-active{color:var(--accent)}.attribution{margin-top:32px;font-size:12px;color:var(--muted);line-height:1.7}.work-edit{display:grid;gap:14px}.work-edit h2{margin:8px 0 0;color:var(--muted);font-size:12px;font-weight:500}.edit-field{display:grid;gap:4px;font-size:12px;color:var(--muted)}.edit-field input,.edit-field textarea,.edit-field select{width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;padding:6px 0;font:14px var(--sans);color:var(--ink)}.edit-field textarea{min-height:4.5em;resize:vertical}.edit-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.edit-look-toolbar{display:flex;flex-wrap:wrap;gap:12px}.dock .work-edit button{width:auto;padding:4px 0;color:var(--muted)}.dock .work-edit .look-list>li>button{width:100%}.dock .work-edit .edit-look-toolbar button.is-on,.dock .work-edit .look-list>li>button.is-active{color:var(--accent)}.look-edit{display:grid;gap:10px;padding:8px 0 12px}.related-edit{border:0;margin:0;padding:0;display:grid;gap:6px}.related-edit legend{padding:0;font-size:12px;color:var(--muted)}.related-edit label{display:flex;gap:8px;align-items:baseline;color:var(--ink);font-size:13px}.app.is-embedded .topbar{padding-block:8px}@media(max-width:900px){.gallery-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:800px){.app{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:"top" "view" "dock"}.app:has(.toolstrip){grid-template-rows:auto auto minmax(0,1fr) auto;grid-template-areas:"top" "tools" "view" "dock"}.dock{max-height:32vh;border-left:0;border-top:1px solid var(--line)}.app.is-editing .dock{max-height:52vh}.canvas-caption{white-space:normal;max-width:calc(100% - 24px);text-align:center}.hall-bar{padding:12px 18px 10px}.hall-enter{margin-left:0}.gallery-grid{padding:0 18px;max-width:1156px}}@media(max-width:640px){.gallery-grid{grid-template-columns:1fr;gap:28px}.gallery-grid>.is-wide{grid-column:auto}.gallery-card.is-hang .gallery-thumb,.gallery-card.is-scroll .gallery-thumb,.gallery-card.is-wide .gallery-thumb{height:180px}}