:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color-scheme:dark;background:#17191d;color:#f3f3f3}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{display:grid;grid-template-rows:auto 1fr;background:#1c1f24}.toolbar{position:relative;z-index:10;display:flex;align-items:center;gap:.48rem;padding:.52rem .68rem;background:#272b31;border-bottom:1px solid #3b4048;white-space:nowrap}.brand{font-weight:750;margin-right:.28rem}.toolbar button,.toolbar select,.fileBtn,.toolbarMenu>summary{font:inherit;border:1px solid #555d68;border-radius:.55rem;background:#333841;color:#fff;padding:.42rem .65rem;cursor:pointer;line-height:1.2}.toolbar button:hover,.fileBtn:hover,.toolbar select:hover,.toolbarMenu>summary:hover{background:#3b414b}.toolbar button:focus-visible,.toolbar select:focus-visible,.fileBtn:focus-within,.toolbarMenu>summary:focus-visible{outline:2px solid #b9dfff;outline-offset:2px}.toolbarMenu{position:relative}.toolbarMenu>summary{list-style:none;user-select:none}.toolbarMenu>summary::-webkit-details-marker{display:none}.toolbarMenu>summary::after{content:"▾";display:inline-block;margin-left:.4rem;font-size:.72em;opacity:.8}.toolbarMenu[open]>summary::after{transform:rotate(180deg)}.menuPanel{position:absolute;top:calc(100% + .42rem);left:0;z-index:30;display:grid;gap:.45rem;min-width:10.5rem;padding:.55rem;border:1px solid #505762;border-radius:.72rem;background:#272c33;box-shadow:0 14px 40px #0009}.menuPanel button,.menuPanel .fileBtn{width:100%;text-align:left}.settingsPanel{min-width:14rem}.toolbar label{display:flex;align-items:center;gap:.45rem;font-size:.9rem}.settingsPanel .compactControl{justify-content:space-between}.settingsPanel select{min-width:7rem}.fileBtn input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.spacer{flex:1}.loadStatus{font-size:.85rem;padding:.25rem .5rem;border-radius:.45rem;background:#15181d;max-width:min(26rem,34vw);overflow:hidden;text-overflow:ellipsis}main{position:relative;min-height:0}canvas{display:block;width:100%;height:100%;touch-action:none;outline:none;background:#20242a}canvas:focus-visible{box-shadow:inset 0 0 0 2px #b9dfff}.complete{pointer-events:none;position:absolute;inset:auto 50% 1.2rem auto;transform:translateX(50%);padding:.7rem 1.1rem;border-radius:999px;background:#101215e8;color:#fff;font-weight:750;box-shadow:0 6px 24px #0008}.hidden{display:none}.srOnly{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.colorControl input[type=color]{width:2.4rem;height:1.85rem;padding:.1rem;border:1px solid #555d68;border-radius:.45rem;background:#333841;cursor:pointer}.colorControl input[type=color]::-webkit-color-swatch-wrapper{padding:1px}.colorControl input[type=color]::-webkit-color-swatch{border:0;border-radius:.3rem}dialog{width:min(92vw,38rem);max-height:86vh;overflow:auto;border:1px solid #555d68;border-radius:1rem;background:#252930;color:#f5f5f5;padding:1.25rem 1.35rem;box-shadow:0 20px 70px #000a}dialog::backdrop{background:#000a}.close{float:right;border:0;background:transparent;color:inherit;font-size:1.8rem;line-height:1;cursor:pointer}dialog h2{margin:.2rem 2rem .3rem 0}.dialogIntro{margin:.25rem 0 1rem;color:#c8ccd2}dialog a{color:#b9dfff}.galleryDialog{width:min(94vw,54rem)}.galleryGrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.7rem}.photoChoice{appearance:none;border:1px solid #4b525d;background:#1c2026;color:#fff;border-radius:.75rem;padding:.35rem;cursor:pointer;text-align:left;overflow:hidden}.photoChoice:hover{border-color:#9fcfff;background:#282e36}.photoChoice:focus-visible{outline:2px solid #b9dfff;outline-offset:2px}.photoChoice img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:.5rem;background:#111}.photoChoice span{display:block;font-size:.78rem;line-height:1.2;padding:.42rem .2rem .15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.previewDialog{width:min(92vw,56rem)}.previewDialog img{display:block;max-width:100%;max-height:70vh;margin:.8rem auto 0;object-fit:contain;border-radius:.6rem}@media(max-width:840px){.galleryGrid{grid-template-columns:repeat(3,minmax(0,1fr))}.loadStatus{max-width:24vw}}@media(max-width:640px){.toolbar{padding:.42rem;gap:.38rem}.brand{font-size:.95rem}.toolbar button,.toolbar select,.fileBtn,.toolbarMenu>summary{padding:.38rem .52rem}.loadStatus{position:absolute;left:.45rem;right:.45rem;top:calc(100% + .35rem);max-width:none;text-align:center;pointer-events:none}.galleryGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.menuPanel{position:fixed;top:3.35rem;left:.45rem;right:.45rem;width:auto;min-width:0}.settingsPanel{grid-template-columns:1fr;min-width:0}.settingsPanel select{min-width:8rem}}@media(max-width:430px){.brand{display:none}.toolbar{justify-content:flex-start;gap:.32rem}.spacer{flex:1}.toolbarMenu>summary,#langBtn{padding-left:.45rem;padding-right:.45rem}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
