.simulator{max-width:1280px;margin:0 auto;padding:16px 20px 48px}.simulator__header{align-items:center;gap:16px;margin-bottom:16px;display:flex}.simulator__title{letter-spacing:-.01em;font-size:1.5rem;font-weight:800}.simulator__layout{grid-template-columns:minmax(0,1fr) 380px;align-items:start;gap:28px;margin-top:18px;display:grid}.simulator__photo{flex-direction:column;gap:14px;display:flex;position:sticky;top:16px}.simulator__panel{flex-direction:column;gap:18px;min-width:0;display:flex}.simulator__scene-info h2{font-size:1.2rem}.simulator__scene-info p{color:var(--color-text-muted);font-size:.9rem}.simulator__scene-info .simulator__goal{background:var(--color-accent);color:var(--color-accent-text);border-radius:6px;margin-top:8px;padding:4px 12px;font-size:.95rem;font-weight:700;display:inline-block}.simulator__controls{flex-direction:column;gap:14px;display:flex}.simulator__actions{flex-wrap:wrap;gap:12px;display:flex}.simulator__shoot{flex:200px}.scene-selector{flex-wrap:wrap;gap:8px;display:flex}.scene-selector__item,.setting-guide__tab{border:2px solid var(--color-ink);background:var(--color-surface);border-radius:999px;min-height:40px;padding:6px 16px;font-size:.9rem;font-weight:700}.scene-selector__item[aria-pressed=true]{background:var(--color-ink);color:var(--color-bg)}.photo-canvas{border:2px solid var(--color-border);border-radius:var(--radius);box-shadow:6px 6px 0 var(--color-shadow);aspect-ratio:3/2;background:#000;position:relative;overflow:hidden}.photo-canvas__image{width:100%;height:100%;display:block}.photo-canvas__overlay{color:#f1ede4;text-align:center;background:#000000bf;justify-content:center;align-items:center;padding:16px;display:flex;position:absolute;inset:0}.photo-canvas__overlay--error{color:#ffb199}.exposure-meter{border:var(--border);border-radius:var(--radius);background:var(--color-surface);padding:10px 14px 8px;font-size:.85rem}.exposure-meter__header{justify-content:space-between;gap:12px;font-weight:700;display:flex}.exposure-meter__header strong{color:var(--color-warn)}.exposure-meter--good .exposure-meter__header strong{color:var(--color-good)}.exposure-meter__track{border:1.5px solid var(--color-ink);background:linear-gradient(90deg,#000,#77727f 50%,#fff);border-radius:6px;height:12px;margin:10px 8px 4px;position:relative}.exposure-meter__center{background:var(--color-ink);width:2px;height:19px;margin-left:-1px;position:absolute;top:-5px;left:50%}.exposure-meter__marker{border:3px solid var(--color-bg);background:var(--color-warn);border-radius:50%;width:18px;height:18px;transition:left .15s ease-out;position:absolute;top:50%;transform:translate(-50%,-50%)}.exposure-meter--good .exposure-meter__marker{background:var(--color-good)}.exposure-meter__scale{color:var(--color-text-muted);justify-content:space-between;font-size:.75rem;display:flex}.setting-control--fNumber,.setting-guide--fNumber,.setting-guide__tab--fNumber{--setting-color:var(--color-f-number)}.setting-control--shutterSeconds,.setting-guide--shutterSeconds,.setting-guide__tab--shutterSeconds{--setting-color:var(--color-shutter)}.setting-control--iso,.setting-guide--iso,.setting-guide__tab--iso{--setting-color:var(--color-iso)}.setting-control{border:var(--border);border-top:8px solid var(--setting-color);border-radius:var(--radius);background:var(--color-surface);box-shadow:4px 4px 0 var(--setting-color);padding:12px 16px}.setting-control__header{justify-content:space-between;align-items:center;gap:12px;display:flex}.setting-control__name{font-size:1rem}.setting-control__tagline{color:var(--color-text-muted);font-size:.8rem}.setting-control__value{color:var(--setting-color);font-family:var(--font-mono);white-space:nowrap;flex-shrink:0;font-size:1.6rem;font-weight:700}.setting-control__row{align-items:center;gap:10px;margin-top:8px;display:flex}.setting-control__step{border:2px solid var(--color-ink);background:var(--color-surface);border-radius:50%;flex-shrink:0;width:44px;height:44px;font-size:.8rem}.setting-control__step:hover:not(:disabled){background:var(--setting-color);color:var(--color-on-color)}.setting-control__step:disabled{opacity:.3}.setting-control__slider{appearance:none;background:0 0;flex:1;min-width:0;height:44px;margin:0}.setting-control__slider::-webkit-slider-runnable-track{border:1.5px solid var(--color-ink);background:var(--color-surface-raised);border-radius:5px;height:10px}.setting-control__slider::-moz-range-track{border:1.5px solid var(--color-ink);background:var(--color-surface-raised);border-radius:5px;height:7px}.setting-control__slider::-webkit-slider-thumb{border:2px solid var(--color-ink);background:var(--setting-color);appearance:none;border-radius:50%;width:24px;height:24px;margin-top:-8.5px}.setting-control__slider::-moz-range-thumb{border:2px solid var(--color-ink);background:var(--setting-color);border-radius:50%;width:20px;height:20px}.setting-control__hints{color:var(--color-text-muted);justify-content:space-between;gap:12px;margin-top:2px;font-size:.75rem;display:flex}.setting-control__hints span:last-child{text-align:right}.shot-result{border:var(--border);border-radius:var(--radius);background:var(--color-surface);box-shadow:var(--shadow);padding:16px}.shot-result__title{font-size:1.15rem;font-weight:800;display:inline-block}.shot-result__settings{font-family:var(--font-mono);font-size:.9rem;font-weight:700}.feedback-list{flex-direction:column;gap:10px;margin:12px 0;padding:0;list-style:none;display:flex}.feedback-list__item{gap:10px;font-size:.9rem;display:flex}.feedback-list__mark{width:26px;height:26px;color:var(--color-on-color);text-align:center;border-radius:50%;flex-shrink:0;font-weight:700;line-height:26px}.feedback-list__item--good .feedback-list__mark{background:var(--color-good)}.feedback-list__item--info .feedback-list__mark{background:var(--color-info)}.feedback-list__item--warn .feedback-list__mark{background:var(--color-warn)}.feedback-list__item p{color:var(--color-text-muted)}.shot-result__note,.setting-guide__note{color:var(--color-text-muted);font-size:.8rem}.setting-guide{border:var(--border);border-radius:var(--radius);background:var(--color-surface);flex-direction:column;gap:10px;padding:16px;font-size:.9rem;display:flex}.setting-guide__tabs{flex-wrap:wrap;gap:6px;display:flex}.setting-guide__tab{border-color:var(--setting-color);color:var(--setting-color)}.setting-guide__tab[aria-pressed=true]{background:var(--setting-color);color:var(--color-on-color)}.setting-guide__title{color:var(--setting-color);font-size:1.05rem}.setting-guide__points{flex-direction:column;gap:6px;margin:0;padding-left:1.2em;display:flex}.setting-guide__points li::marker{color:var(--setting-color)}.setting-guide__note{border-top:2px dashed var(--color-border);padding-top:10px}@media (width<=900px){.simulator{padding:12px 12px 40px}.simulator__layout{grid-template-columns:minmax(0,1fr);gap:18px}.simulator__photo{position:static}.photo-canvas{box-shadow:var(--shadow)}}@media (width<=900px) and (height>=640px){.simulator__photo{z-index:1;border-bottom:var(--border);background:var(--color-bg);margin:0 -12px;padding:8px 16px 10px 12px;position:sticky;top:0}.photo-canvas{width:100%;max-width:57vh;margin:0 auto}}@media (width<=480px){.simulator__title{font-size:1.15rem}.setting-control__value{font-size:1.3rem}}.viewfinder{border:2px solid var(--color-border);border-radius:var(--radius);box-shadow:6px 6px 0 var(--color-shadow);aspect-ratio:3/2;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;background:#000;position:relative;overflow:hidden}.viewfinder:active{cursor:grabbing}.viewfinder__image{pointer-events:none;max-width:none;position:absolute;top:0;left:0}.viewfinder__guide{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.viewfinder__guide line{stroke:#fff;stroke-width:1.5px;stroke-opacity:.85;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 1px #000c)}.viewfinder__guide circle{fill:var(--color-accent);stroke:#000;stroke-width:1px;vector-effect:non-scaling-stroke}.frame-map{color:var(--color-text-muted);align-items:center;gap:12px;margin:0;font-size:.8rem;display:flex}.frame-map__photo{border:1px solid var(--color-border);aspect-ratio:3/2;border-radius:6px;flex-shrink:0;width:150px;position:relative;overflow:hidden}.frame-map__photo img{opacity:.55;width:100%;height:100%;display:block}.frame-map__frame{border:2px solid var(--color-accent);position:absolute;box-shadow:0 0 0 1px #000}.frame-controls{--setting-color:var(--color-accent);border:var(--border);border-top:8px solid var(--setting-color);border-radius:var(--radius);background:var(--color-surface);box-shadow:4px 4px 0 var(--setting-color);flex-direction:column;padding:8px 16px 12px;display:flex}.frame-controls__row{align-items:center;gap:12px;display:flex}.frame-controls__name{flex-shrink:0;width:3.5em;font-weight:700}.frame-controls__value{width:3.2em;color:var(--setting-color);font-family:var(--font-mono);text-align:right;flex-shrink:0;font-weight:700}.frame-controls input:disabled{opacity:.35}.frame-controls__hint{color:var(--color-text-muted);font-size:.8rem}.guide-panel{--setting-color:var(--color-accent)}.guide-panel .scene-selector__item{min-height:36px;padding:4px 14px}@media (width<=900px){.viewfinder{box-shadow:var(--shadow)}.frame-map__photo{width:96px}}@media (width<=900px) and (height>=640px){.viewfinder{width:100%;max-width:57vh;margin:0 auto}}.home{max-width:960px;margin:0 auto;padding:56px 20px 64px}.home__hero{margin-bottom:44px}.home__title{letter-spacing:-.02em;font-size:clamp(2.6rem,9vw,4.5rem);font-weight:800;line-height:1.1;display:inline-block}.home__reading{color:var(--color-text-muted);letter-spacing:.3em;font-size:.9rem;font-weight:700}.home__lead{max-width:34em;margin-top:16px;font-size:1.05rem}.home__legend{flex-wrap:wrap;gap:8px;margin:20px 0 0;padding:0;list-style:none;display:flex}.home__legend li{color:var(--color-on-color);border-radius:999px;padding:2px 14px;font-size:.85rem;font-weight:700}.home__legend li:first-child{background:var(--color-f-number)}.home__legend li:nth-child(2){background:var(--color-shutter)}.home__legend li:nth-child(3){background:var(--color-iso)}.home__modes{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;display:grid}.home__mode{border:var(--border);border-radius:var(--radius);background:var(--color-surface);box-shadow:5px 5px 0 var(--color-f-number);flex-direction:column;align-items:flex-start;gap:10px;padding:24px;display:flex}.home__mode:nth-child(2){box-shadow:5px 5px 0 var(--color-shutter)}.home__mode:nth-child(2) .home__mode-number{color:var(--color-shutter)}.home__mode-number{font-family:var(--font-mono);color:var(--color-f-number);font-size:.85rem;font-weight:700}.home__mode h2{text-wrap:balance;font-size:1.3rem;line-height:1.4}.home__mode p{color:var(--color-text-muted);flex:1;margin-bottom:6px}.home__mode--disabled{box-shadow:none;background:0 0;border-style:dashed}.home__mode--disabled .home__mode-number,.home__mode--disabled h2{color:var(--color-text-muted)}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--color-bg:#17151b;--color-surface:#211e27;--color-surface-raised:#2f2b37;--color-ink:#f2ede3;--color-border:#4a4554;--color-shadow:#050506;--color-text:#f2ede3;--color-text-muted:#aba5b6;--color-on-color:#17151b;--color-f-number:#ff6b4a;--color-shutter:#4d9bff;--color-iso:#2fcf8f;--color-accent:#ffcf3f;--color-accent-text:#17151b;--color-good:#2fcf8f;--color-info:#4d9bff;--color-warn:#ff7a55;--gradient-title:linear-gradient(95deg, #ff6b4a 0%, #ffb020 35%, #2fcf8f 70%, #4d9bff 100%);--border:2px solid var(--color-border);--shadow:4px 4px 0 var(--color-shadow);--shadow-small:3px 3px 0 var(--color-shadow);--radius:10px;--font-sans:"Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic UI", Meiryo, system-ui, sans-serif;--font-mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-sans);margin:0;line-height:1.7}h1,h2,h3,p{margin:0}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:not-allowed}:focus-visible{outline:3px solid var(--color-shutter);outline-offset:2px}.gradient-text{background:var(--gradient-title);color:#0000;-webkit-background-clip:text;background-clip:text}.button{border:2px solid var(--color-ink);background:var(--color-surface);min-height:44px;box-shadow:var(--shadow-small);border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:8px 20px;font-weight:700;transition:transform 80ms ease-out,box-shadow 80ms ease-out;display:inline-flex}.button:hover:not(:disabled){box-shadow:4px 4px 0 var(--color-shadow);transform:translate(-1px,-1px)}.button:active:not(:disabled){box-shadow:none;transform:translate(3px,3px)}.button:disabled{border-color:var(--color-border);box-shadow:none;color:var(--color-text-muted)}.button--primary{background:var(--color-accent);color:var(--color-accent-text)}.button--ghost{box-shadow:none;background:0 0}.button--ghost:hover:not(:disabled){box-shadow:none;background:var(--color-surface-raised);transform:none}@media (prefers-reduced-motion:reduce){*{transition:none!important}}