: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}.menuPanelEnd{left:auto;right:0}.menuPanel button,.menuPanel .fileBtn{width:100%;text-align:left}.settingsPanel{min-width:14.5rem}.toolbar label{display:flex;align-items:center;gap:.45rem;font-size:.9rem}.settingsPanel .compactControl{justify-content:space-between}.settingsPanel select{min-width:7.2rem}.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;color:#f3f3f3;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:radial-gradient(circle at 50% 40%,#343a42,#20242a 70%)}canvas:focus-visible{box-shadow:inset 0 0 0 2px #b9dfff}.complete{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}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}@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))}.photoChoice span{font-size:.74rem}.menuPanel{position:fixed;top:3.35rem;left:.45rem;right:.45rem;width:auto;min-width:0}.menuPanelEnd{left:.45rem}.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::after{margin-left:.28rem}.toolbarMenu>summary,#langBtn{padding-left:.45rem;padding-right:.45rem}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}