:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#0f172a;color:#fff}*{box-sizing:border-box}html,body,#app{width:100%;min-height:100%;margin:0}body{min-height:100dvh;overflow:hidden;overscroll-behavior:none;touch-action:none;background:radial-gradient(circle at top,#334155,#0f172a 60%)}#app{min-height:100dvh;display:grid;place-items:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}canvas{display:block;max-width:100vw;max-height:100dvh;box-shadow:0 22px 60px #00000059}.level-select{position:fixed;z-index:15;left:max(10px,env(safe-area-inset-left));top:max(10px,env(safe-area-inset-top));width:min(330px,calc(100vw - 20px));max-height:calc(100dvh - 20px);overflow:auto;padding:12px;border:1px solid #475569;border-radius:16px;background:#0f172af0;box-shadow:0 18px 44px #00000059;touch-action:auto;overscroll-behavior:contain}.level-select__heading{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:start;margin-bottom:10px}.level-select__heading>div{display:grid;gap:2px}.level-select__heading strong{font-size:18px}.level-select__heading span{color:#94a3b8;font-size:12px}.level-select__toggle{min-height:36px;border:1px solid #475569;border-radius:9px;padding:7px 10px;background:#1e293b;color:#f8fafc;font:inherit;font-size:12px;font-weight:800;cursor:pointer;touch-action:manipulation}.level-select.is-collapsed>:not(.level-select__heading){display:none}.level-select__tutorial,.level-select__active-hint{margin:8px 0;border:1px solid #475569;border-radius:10px;background:#111827;color:#e2e8f0}.level-select__tutorial summary,.level-select__active-hint summary{cursor:pointer;padding:8px 9px;font-size:12px;font-weight:800}.level-select__tutorial ol{margin:0;padding:0 12px 0 30px;color:#cbd5e1;font-size:11px;line-height:1.5}.level-select__tutorial p,.level-select__active-hint p{margin:7px 9px 9px;color:#cbd5e1;font-size:11px;line-height:1.45}.level-select__active-hint{border-color:#2563eb}.level-select__active-hint [data-hint-text]{color:#bfdbfe}.level-select__world{margin-top:12px}.level-select__world h2{margin:0 0 6px;color:#e2e8f0;font-size:13px}.level-select__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.level-select__level{min-width:0;display:grid;grid-template-columns:28px 1fr;grid-template-areas:"number name" "number stars";gap:2px 6px;align-items:center;border:1px solid #475569;border-radius:10px;padding:8px;background:#1e293b;color:#f8fafc;text-align:left;cursor:pointer}.level-select__level:disabled{opacity:.48;cursor:not-allowed}.level-select__number{grid-area:number;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#2563eb;font-weight:800}.level-select__name{grid-area:name;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:700}.level-select__stars{grid-area:stars;color:#fbbf24;font-size:11px;letter-spacing:1px}.level-editor{position:fixed;z-index:20;top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));width:min(340px,calc(100vw - 20px));max-height:calc(100dvh - 20px);overflow:auto;border:1px solid #475569;border-radius:14px;background:#0f172af5;box-shadow:0 18px 44px #0006;color:#e2e8f0;touch-action:auto;overscroll-behavior:contain}.level-editor summary{cursor:pointer;padding:11px 13px;font-weight:800;-webkit-user-select:none;user-select:none}.level-editor__body{display:grid;gap:8px;padding:0 13px 13px}.level-editor label{display:grid;gap:3px;color:#cbd5e1;font-size:12px}.level-editor input,.level-editor select,.level-editor textarea,.level-editor button{font:inherit}.level-editor input,.level-editor select,.level-editor textarea{width:100%;border:1px solid #475569;border-radius:8px;background:#111827;color:#f8fafc;padding:7px}.level-editor textarea{min-height:145px;resize:vertical;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;line-height:1.35}.level-editor__actions{display:flex;flex-wrap:wrap;gap:6px}.level-editor button{border:0;border-radius:8px;padding:7px 9px;background:#334155;color:#fff;font-weight:700;cursor:pointer}.level-editor button:first-child{background:#2563eb}.level-editor__status{min-height:18px;color:#86efac;font-size:12px}.level-editor__status[data-error=true]{color:#fca5a5}.result-panel[hidden]{display:none}.result-panel{position:fixed;z-index:50;inset:0;display:grid;place-items:center;padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));background:#0206179e;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);touch-action:auto}.result-panel__card{width:min(360px,100%);border:1px solid #475569;border-radius:24px;padding:24px;background:#0f172a;box-shadow:0 28px 80px #0000008c;text-align:center}.result-panel__card[data-result=won]{border-color:#22c55e}.result-panel__card[data-result=lost]{border-color:#ef4444}.result-panel__eyebrow{margin:0 0 8px;color:#94a3b8;font-size:12px;font-weight:800;letter-spacing:.12em}.result-panel h2{margin:0;font-size:30px}.result-panel__level{margin:8px 0 0;color:#cbd5e1;font-weight:700}.result-panel__stars{margin:16px 0 4px;color:#fbbf24;font-size:34px;letter-spacing:5px;text-shadow:0 4px 20px rgba(251,191,36,.25)}.result-panel__detail{margin:12px 0 20px;color:#cbd5e1;font-size:14px;line-height:1.5}.result-panel__actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.result-panel__actions button{min-height:44px;border:1px solid #475569;border-radius:12px;background:#1e293b;color:#f8fafc;font:inherit;font-weight:800;cursor:pointer}.result-panel__actions button.primary{border-color:#2563eb;background:#2563eb}.result-panel__actions button:last-child:nth-child(3){grid-column:1 / -1}.feedback-settings{position:fixed;z-index:18;left:max(10px,env(safe-area-inset-left));bottom:max(10px,env(safe-area-inset-bottom));width:min(210px,calc(100vw - 20px));border:1px solid #475569;border-radius:12px;padding:8px 10px;background:#0f172af0;color:#e2e8f0;touch-action:auto}.feedback-settings summary{cursor:pointer;font-size:12px;font-weight:800}.feedback-settings label{display:block;margin-top:8px;font-size:12px}.feedback-settings input{accent-color:#2563eb}.feedback-settings p{margin:8px 0 0;color:#94a3b8;font-size:10px;line-height:1.35}@media(max-width:1100px){.level-select{width:min(280px,calc(100vw - 20px))}.level-select__grid{grid-template-columns:1fr}}@media(max-width:820px){body{height:100dvh;min-height:100dvh}#app{position:fixed;z-index:1;top:max(54px,calc(env(safe-area-inset-top) + 46px));right:0;bottom:max(108px,calc(env(safe-area-inset-bottom) + 100px));left:0;width:100%;height:auto;min-height:0;padding:0;overflow:hidden}canvas{max-width:100%;max-height:100%;box-shadow:0 12px 32px #0000003d}.level-select{top:max(8px,env(safe-area-inset-top));left:8px;width:min(360px,calc(100vw - 16px));max-height:72dvh}.level-select__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.level-select.is-collapsed{width:auto;max-height:none;overflow:visible;padding:0;border:0;background:transparent;box-shadow:none}.level-select.is-collapsed .level-select__heading{display:block;margin:0}.level-select.is-collapsed .level-select__heading>div{display:none}.level-select.is-collapsed .level-select__toggle{min-height:38px;padding:8px 12px;border-color:#64748b;background:#0f172af5;box-shadow:0 8px 20px #00000040}.level-editor:not([open]){top:max(8px,env(safe-area-inset-top));right:8px;bottom:auto;width:auto;max-height:none;overflow:visible}.level-editor:not([open]) summary{min-height:38px;padding:8px 10px;font-size:0}.level-editor:not([open]) summary:after{content:"編輯器";font-size:11px}.level-editor[open]{top:max(54px,calc(env(safe-area-inset-top) + 46px));right:8px;bottom:max(8px,env(safe-area-inset-bottom));width:min(360px,calc(100vw - 16px));max-height:none}.feedback-settings:not([open]){left:8px;bottom:max(8px,env(safe-area-inset-bottom));width:auto;max-width:none;padding:0}.feedback-settings:not([open]) summary{min-height:38px;padding:8px 10px;font-size:0}.feedback-settings:not([open]) summary:after{content:"音效";font-size:11px}.feedback-settings[open]{left:8px;bottom:max(54px,calc(env(safe-area-inset-bottom) + 46px));width:min(205px,calc(100vw - 16px))}.result-panel__card{padding:20px}}.item-dock{position:fixed;z-index:19;left:50%;bottom:max(10px,env(safe-area-inset-bottom));transform:translate(-50%);display:grid;gap:4px;width:min(250px,calc(100vw - 24px));padding:8px 10px;border:1px solid #475569;border-radius:14px;background:#0f172af0;box-shadow:0 14px 34px #00000059;touch-action:auto;text-align:center}.item-dock button{min-height:40px;border:1px solid #2563eb;border-radius:10px;background:#1d4ed8;color:#fff;font:inherit;font-weight:800;cursor:pointer}.item-dock button:disabled{border-color:#475569;background:#334155;color:#94a3b8;cursor:not-allowed}.item-dock span{color:#cbd5e1;font-size:10px;line-height:1.3}@media(max-width:820px){#assist-stroke{position:fixed;z-index:21;top:max(8px,env(safe-area-inset-top));left:50%;transform:translate(-50%);min-height:38px;border:1px solid #475569;border-radius:10px;padding:8px 10px;background:#0f172af5;color:#f8fafc;font:inherit;font-size:11px;font-weight:800;touch-action:manipulation}.item-dock{bottom:max(52px,calc(env(safe-area-inset-bottom) + 52px));width:min(310px,calc(100vw - 96px));grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:6px}.item-dock button{min-height:36px;padding:6px 8px;font-size:12px}.item-dock span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}}