:root{font-family:Hiragino Maru Gothic ProN,Yu Gothic,sans-serif;color:#4d503e;background:#f0f1e6;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #d6a44d;outline-offset:3px}#app{height:100dvh;min-height:480px;background:radial-gradient(ellipse at 44% 45%,#fafbed,#e1e9d6)}canvas{width:100%;height:100%;display:block;touch-action:none}header{position:absolute;top:38px;left:42px;pointer-events:none}.eyebrow{font-size:10px;letter-spacing:3px;color:#92957b}h1{font-family:Yu Mincho,Hiragino Mincho ProN,serif;font-weight:500;font-size:34px;line-height:1.5;letter-spacing:4px;margin:15px 0 10px}h1 span{display:inline-block;font-size:25px;margin-left:16px;color:#ac8a55}header p{font-size:12px;letter-spacing:2px;color:#8a8975}.panel{position:absolute;right:30px;top:36px;width:222px;padding:22px 18px;background:#fffcf1e8;border:1px solid #fff;border-radius:18px;box-shadow:0 7px 32px #5d4d3110;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.panel-title{font-size:14px;font-weight:700;letter-spacing:2px;display:flex;justify-content:space-between}.panel-title span{color:#b8a16b}.caption{font-size:10px;line-height:1.7;color:#92927b;margin:9px 0 14px}#actions{display:grid;gap:8px}.action{display:flex;align-items:center;gap:10px;text-align:left;background:#f4f0e4;border:1px solid #e8e5d7;border-radius:9px;padding:11px 10px;font-size:11px;transition:.2s}.action .icon{font-size:17px;width:24px;text-align:center}.action:hover{background:#e9e6d4;transform:translateY(-1px)}.action.active{background:#5f7050;color:#fffae8;border-color:#5f7050}.divider{height:1px;background:#e6e2d3;margin:18px 0}.switch{display:flex;align-items:center;justify-content:space-between;font-size:11px}.switch input{accent-color:#6d8057;width:18px;height:18px}.time-title{font-size:11px;margin-bottom:10px}.segmented{display:flex;gap:5px}.segmented button{flex:1;border:0;border-radius:8px;background:#eeeade;font-size:11px;padding:9px 3px}.segmented .selected{background:#637451;color:#fff8e7}footer{position:absolute;bottom:33px;left:42px;right:30px;display:flex;justify-content:space-between;align-items:center;gap:12px}.status{display:flex;gap:12px;align-items:center;padding:13px 22px;background:#fffcf1e8;border:1px solid #fff;border-radius:14px;min-width:300px;box-shadow:0 5px 25px #5d4d3109}.status small{display:block;color:#94947c;font-size:9px;letter-spacing:2px;margin-bottom:5px}.status strong{font-size:12px;font-weight:500}.live-dot{height:7px;width:7px;background:#829061;border-radius:50%}.toolbar{display:flex;gap:7px}.toolbar button{border:1px solid #fff;background:#fffcf1ed;border-radius:10px;padding:13px 14px;font-size:13px}.toolbar button span{font-size:11px;margin-left:5px}.hint{position:absolute;bottom:9px;left:44px;font-size:9px;color:#999783;letter-spacing:1px}#bubble{position:absolute;pointer-events:none;background:#fffbedee;padding:10px 17px;border-radius:18px 18px 18px 3px;font-size:11px;box-shadow:0 4px 20px #44331b15;white-space:nowrap;transform:translate(-50%,-120%)}#bubble:empty{display:none}#error{position:absolute;inset:30%;background:#fff;padding:24px;z-index:20}@media(max-width:760px){header{top:20px;left:22px}h1{font-size:24px;letter-spacing:2px;margin:9px 0 5px}.eyebrow{font-size:7px;letter-spacing:2px}header p{font-size:9px;letter-spacing:1px}.panel{inset:auto 14px 130px;width:auto;padding:12px;border-radius:15px}.panel-title,.panel>.caption,.divider,.time-title{display:none}#actions{grid-template-columns:repeat(5,1fr);gap:4px}.action{padding:8px 2px;flex-direction:column;gap:5px;font-size:8px;text-align:center;white-space:nowrap}.action .icon{font-size:18px}.switch{position:absolute;top:-34px;left:10px;background:#fffcf1e8;padding:4px 10px;border-radius:9px;font-size:10px}.segmented{position:absolute;right:0;top:-34px;width:128px}.segmented button{padding:7px 3px;font-size:10px}footer{left:14px;right:14px;bottom:22px;flex-wrap:wrap;gap:7px}.status{min-width:0;width:100%;padding:9px 13px;border-radius:11px}.status small{font-size:8px;margin-bottom:3px}.status strong{font-size:10px}.toolbar{margin-left:auto}.toolbar button{padding:8px 12px;font-size:12px}.toolbar button span{font-size:9px}.hint{left:17px;bottom:6px;font-size:7px}#bubble{font-size:10px;padding:7px 11px}}@media(prefers-reduced-motion:reduce){.action{transition:none}}@media(max-width:760px){#actions{grid-template-columns:repeat(5,minmax(0,1fr))}.action{min-width:0;font-size:7px;white-space:normal;line-height:1.4}.action>span:last-child{min-height:20px;display:flex;align-items:center;justify-content:center}.panel{bottom:130px}}@media(max-width:760px){.toolbar{gap:4px}.toolbar button{padding:8px 9px}}h1 .title-sub{display:block;font-size:15px;margin:7px 0 0;color:#827961;letter-spacing:2px}.night{color:#f0e8d6;background:#172333}.night #app{background:#172333}.night .eyebrow{color:#b4bfcb}.night h1 .title-sub,.night h1>span{color:#d5bf91}.night header p{color:#b4bfcb}.night .panel,.night .status,.night .toolbar button,.night .switch{background:#253344eb;border-color:#59637366;color:#ece4d6}.night .panel{box-shadow:0 10px 35px #0002}.night .caption,.night .status small{color:#a9b8c4}.night .action{background:#314052;border-color:#50607466;color:#e4e5dc}.night .action.active{background:#d1bc8f;color:#24323b;border-color:#d1bc8f}.night .action:hover{background:#526375}.night .action.active:hover{background:#e1cca0}.night .divider{background:#53617166}.night .segmented button{background:#314052;color:#d1d7dd}.night .segmented button.selected{background:#d1bc8f;color:#24323b}.night .hint{color:#a5b0ba}.night #bubble{color:#5f5442}.night input{accent-color:#d1bc8f}.toolbar{gap:5px}.toolbar button{padding:12px 10px}@media(max-width:1000px)and (min-width:761px){.panel{width:190px;right:20px;padding:17px 13px}.toolbar button span{font-size:9px}.toolbar button{padding:12px 7px}footer{left:24px;right:20px}.status{min-width:245px;padding:13px}.status strong{font-size:10px}}@media(max-width:760px){h1 .title-sub{font-size:11px;letter-spacing:1px}.toolbar{width:100%;justify-content:flex-end}.toolbar button{padding:8px 6px}.toolbar button span{font-size:8px}.night .segmented button{font-size:9px}.action{font-size:8px}.status{min-width:0}.panel{bottom:133px}}#night-sky{position:absolute;inset:0;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 50% 85%,#263a51,#131d32 80%)}#night-sky[hidden]{display:none}#star-field{position:absolute;inset:0;width:100%;height:100%}.smiling-moon{position:absolute;left:51%;top:4%;width:110px;filter:drop-shadow(0 0 18px #f6df9550)}.smiling-moon svg{display:block;width:100%}#world{position:relative;z-index:1}header,.panel,footer,.hint,#bubble,#error{z-index:2}.story-progress{font-size:10px;margin-top:12px;line-height:1.8}.progress-top{display:flex;justify-content:space-between}.story-progress progress{appearance:none;width:100%;height:5px;border:0;border-radius:6px;overflow:hidden}.story-progress progress::-webkit-progress-bar{background:#7d879044}.story-progress progress::-webkit-progress-value{background:#d5abc0;border-radius:6px}.story-progress select{font:inherit;margin-left:8px;border:1px solid #9d9b8855;border-radius:5px;padding:3px 5px;background:#f2ecdf;color:#454b43}#cycle-status{font-size:9px;opacity:.75;margin:3px 0}.night .story-progress select{background:#314052;color:#f2e7d3}.panel{top:22px;padding-top:16px;padding-bottom:15px}.panel .divider{margin:12px 0}.panel #actions{gap:6px}.action{padding:9px 8px}.night .smiling-moon{display:block}@media(max-width:760px){.smiling-moon{width:75px;top:135px;left:auto;right:25px}.panel{top:auto;bottom:135px;padding:10px 12px}#actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}.action{flex-direction:row;padding:6px 3px;font-size:8px;gap:3px}.action .icon{font-size:16px;width:19px}.action>span:last-child{min-height:0}.story-progress{display:grid;grid-template-columns:1fr auto auto;gap:2px 8px;font-size:9px;margin-top:6px;align-items:center}.progress-top{grid-column:1;grid-row:1}.story-progress progress{grid-column:1;grid-row:2}.story-progress label{grid-column:2;grid-row:1 / span 2}.story-progress select{grid-column:3;grid-row:1 / span 2;margin:0}#cycle-status{display:none}.switch,.segmented{top:-31px}.toolbar button{padding:8px 5px}h1 .title-sub{font-size:10px}}#finished-preview{font:inherit;border:1px solid #a6a79766;border-radius:5px;background:transparent;padding:3px 8px;margin-top:4px;font-size:9px}.night #finished-preview{color:#e4d3ac}@media(min-width:761px){.panel{max-height:calc(100dvh - 140px);overflow-y:auto}}@media(max-width:760px){#finished-preview{grid-column:1;grid-row:3;justify-self:start;font-size:8px;margin:0;padding:1px 6px}}#mobile-panel-toggle[hidden],#mobile-controls[hidden]{display:none!important}body.mobile-ui #app{height:100dvh;min-height:0}body.mobile-ui #world{position:absolute;inset:0;width:100%;height:100%}body.mobile-ui #mobile-panel-toggle{position:fixed;z-index:5;right:max(14px,env(safe-area-inset-right));bottom:calc(12px + env(safe-area-inset-bottom));min-height:44px;padding:8px 16px;border:1px solid #b6b49c80;border-radius:24px;background:#fffcf1db;color:#4d503e;font-size:12px;box-shadow:0 3px 14px #0002}body.mobile-ui.night #mobile-panel-toggle{background:#253344dc;color:#ece4d6}body.mobile-ui #mobile-controls{display:block!important;position:fixed;z-index:3;bottom:calc(64px + env(safe-area-inset-bottom));left:12px;right:12px;height:clamp(170px,29dvh,240px);overflow:auto;overscroll-behavior:contain;border:1px solid #b6b49c50;border-radius:16px;background:#fffcf1b8;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);scrollbar-width:thin}body.mobile-ui.night #mobile-controls{background:#253344b8}body.mobile-ui #mobile-controls[hidden]{display:none!important}body.mobile-ui #mobile-controls .panel{position:static;display:flex;flex-direction:column;width:auto;max-height:none;overflow:visible;padding:10px;margin:0;background:transparent;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}body.mobile-ui .panel-title,body.mobile-ui .panel>.caption,body.mobile-ui .divider,body.mobile-ui .time-title{display:none}body.mobile-ui #actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}body.mobile-ui .action{min-width:0;min-height:40px;padding:6px 3px;flex-direction:row;gap:3px;font-size:9px;white-space:normal}body.mobile-ui .action .icon{font-size:16px;width:19px}body.mobile-ui .action>span:last-child{min-height:0}body.mobile-ui .switch{order:-1;position:static;display:flex;margin:0 0 6px;padding:0;background:transparent;font-size:11px}body.mobile-ui .segmented{position:static;width:auto;margin-top:6px}body.mobile-ui .segmented button{min-height:34px}body.mobile-ui #mobile-controls footer{position:static;width:auto;margin:0 10px 10px;padding:0;background:transparent;display:flex;flex-wrap:wrap;gap:5px}body.mobile-ui .status{min-width:0;width:100%;padding:6px 8px;background:transparent;box-shadow:none;border:0}body.mobile-ui .status small{display:none}body.mobile-ui .status strong{font-size:10px}body.mobile-ui .toolbar{width:100%;display:flex;flex-wrap:wrap;justify-content:center;gap:4px}body.mobile-ui .toolbar button{min-height:40px;padding:7px 6px}body.mobile-ui .toolbar button span{font-size:8px}body.mobile-ui .hint{display:none}body.mobile-ui #bubble{position:fixed;left:50%!important;top:calc(env(safe-area-inset-top) + 145px)!important;transform:translate(-50%);max-width:calc(100vw - 32px);white-space:normal;text-align:center;font-size:10px;padding:6px 10px;line-height:1.4;border-radius:12px;z-index:4}body.mobile-ui.mobile-panel-open header p{display:none}body.mobile-ui.mobile-panel-open #bubble{top:calc(env(safe-area-inset-top) + 112px)!important}@media(orientation:landscape){body.mobile-ui header{top:calc(8px + env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left))}body.mobile-ui h1{font-size:20px;margin:4px 0;letter-spacing:2px}body.mobile-ui h1 .title-sub{font-size:10px;margin:2px 0}body.mobile-ui .eyebrow{font-size:7px}body.mobile-ui header p{display:none}body.mobile-ui #mobile-controls{top:calc(8px + env(safe-area-inset-top));bottom:calc(64px + env(safe-area-inset-bottom));height:auto;left:auto;right:max(10px,env(safe-area-inset-right));width:210px}body.mobile-ui #actions{grid-template-columns:repeat(2,minmax(0,1fr))}body.mobile-ui .story-progress{display:block;font-size:10px}body.mobile-ui .progress-top{display:flex;justify-content:space-between}body.mobile-ui .story-progress label{display:inline}body.mobile-ui .story-progress select{margin-left:5px}body.mobile-ui #finished-preview{display:block;margin-bottom:5px}body.mobile-ui #bubble,body.mobile-ui.mobile-panel-open #bubble{top:calc(8px + env(safe-area-inset-top))!important;left:45%!important;max-width:30vw}body.mobile-ui .smiling-moon{top:75px;left:47%;width:60px}}