/* Games by Ark · Batch 01. All game chrome stays inside the host's play region. */
:root{color-scheme:dark}*{box-sizing:border-box}body.ark-page{margin:0;background:#080e1b;color:#edf4ff;font:14px/1.45 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP",sans-serif;display:flex;flex-direction:column;height:100vh;height:100svh;padding-top:var(--ark-fixed-top,0px);padding-bottom:var(--ark-fixed-bottom,0px)}
.ark-game{--accent:#79f4cb;--ink:#0a1719;position:relative;flex:1 0 620px;min-width:0;isolation:isolate;overflow:hidden;background:#101627}.ark-game button,.ark-game a,.ark-game input{font-family:inherit;-webkit-tap-highlight-color:transparent}.ark-game button{cursor:pointer;touch-action:manipulation}.ark-game a{color:inherit;text-decoration:none}.ark-game button:focus-visible,.ark-game a:focus-visible,.ark-game canvas:focus-visible{outline:3px solid #fff;outline-offset:3px}.ark-game button:disabled{opacity:.42;cursor:default}.ark-game [hidden]{display:none!important}
#ark-scene{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;outline:0}.ark-vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(5,9,22,.65) 0%,transparent 25%,transparent 60%,rgba(5,9,22,.75) 100%),linear-gradient(90deg,rgba(5,9,22,.65),transparent 28%,transparent 78%,rgba(5,9,22,.3))}
.ark-top{position:absolute;inset:18px 28px auto;display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:4;pointer-events:none}.ark-top>*{pointer-events:auto}.ark-brand{display:flex;gap:10px;align-items:center;font-size:12px;font-weight:750;letter-spacing:.025em}.ark-brand-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;color:#09111e;background:var(--accent);font-size:22px;font-weight:950;box-shadow:0 4px 20px #0003}.ark-brand small{display:block;color:#9cabc1;font-size:9px;font-weight:600;letter-spacing:.19em;margin-top:2px}.ark-tools{display:flex;gap:7px;align-items:center}.ark-icon{height:42px;min-width:42px;display:grid;place-items:center;padding:0 12px;background:#111c2cd9;border:1px solid #63748c60;border-radius:12px;color:#e6effb;font-size:12px;font-weight:750;transition:background .15s,transform .15s}.ark-icon:hover{background:#31415c;transform:translateY(-1px)}.ark-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.ark-icon[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}
.ark-mission{position:absolute;left:36px;top:104px;width:300px;z-index:3;pointer-events:none}.ark-kicker{font-size:10px;font-weight:850;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}.ark-mission h1{font-size:clamp(32px,3.5vw,58px);font-weight:950;line-height:.98;letter-spacing:-.055em;margin:13px 0 16px;text-wrap:balance;max-width:330px;text-shadow:0 5px 28px #0006}.ark-mission p{font-size:13px;line-height:1.65;max-width:250px;color:#c6d0e1;margin:0}.ark-mission .ark-stamp{display:inline-flex;align-items:center;gap:6px;font-size:10px;margin-top:20px;padding:7px 10px;border:1px solid #66768c60;border-radius:5px;color:#bdcce1;letter-spacing:.06em;background:#111b2b90}
.ark-record{position:absolute;right:32px;top:100px;text-align:right;z-index:3;display:grid;gap:4px}.ark-record small{font-size:9px;letter-spacing:.16em;color:#9cabc1;font-weight:750}.ark-record strong{font-size:26px;letter-spacing:-.04em}.ark-record em{font-size:10px;font-style:normal;color:#a7b6cb}.ark-mode{display:flex;gap:3px;border-radius:10px;background:#0b1220c7;border:1px solid #697f9644;padding:4px;margin-top:10px;pointer-events:auto}.ark-mode button{min-height:36px;padding:0 12px;border:0;border-radius:6px;font-weight:750;font-size:10px;color:#a8b7cb;background:transparent}.ark-mode button[aria-pressed=true]{color:var(--ink);background:var(--accent)}
.ark-build{position:absolute;left:28px;right:28px;bottom:24px;z-index:4;display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(190px,.83fr);gap:12px;align-items:stretch;max-width:1460px;margin:0 auto}.ark-field{margin:0;padding:13px 14px 12px;background:linear-gradient(140deg,#18263aeF,#0b1525ee);border:1px solid #8195b044;border-radius:15px;min-width:0;box-shadow:0 10px 30px #0002}.ark-field legend{display:none}.ark-field-title{display:flex;align-items:center;gap:8px;color:#d3dfed;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.11em;margin-bottom:9px}.ark-field-title b{color:var(--accent);font-variant-numeric:tabular-nums}.ark-choices{display:flex;gap:5px}.ark-choice{color:#c4d2e4;background:#24334a73;border:1px solid #5b6a853b;border-radius:8px;flex:1;min-width:0;min-height:54px;padding:6px 4px;display:grid;align-content:center;justify-items:center;gap:2px;transition:background .14s,transform .14s}.ark-choice strong{font-size:11px;font-weight:800;white-space:nowrap}.ark-choice span{font-size:9px;color:#9faec3;white-space:nowrap}.ark-choice:hover{background:#344761;transform:translateY(-2px)}.ark-choice[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--ink);box-shadow:0 0 20px color-mix(in srgb,var(--accent) 18%,transparent)}.ark-choice[aria-pressed=true] span{color:#17392fe0}.ark-launch-wrap{display:flex;flex-direction:column;justify-content:center;gap:9px}.ark-primary{border:0;border-bottom:4px solid #0004;border-radius:12px;background:var(--accent);color:var(--ink);min-height:58px;padding:12px 20px;font-size:15px;font-weight:900;display:flex;align-items:center;justify-content:center;gap:12px;box-shadow:0 7px 24px #0003;transition:transform .12s,filter .12s}.ark-primary:hover{filter:brightness(1.1);transform:translateY(-2px)}.ark-primary:active{transform:translateY(2px);border-bottom-width:2px}.ark-launch-wrap small{color:#aabacf;font-size:10px;text-align:center}.ark-primary svg{width:18px;height:18px;fill:currentColor}
.ark-live{position:absolute;inset:92px 30px auto;display:flex;align-items:flex-start;justify-content:space-between;pointer-events:none;z-index:3}.ark-score{display:flex;flex-direction:column;line-height:1.05}.ark-score small{font-size:10px;font-weight:800;letter-spacing:.18em;color:#b9c8dd}.ark-score strong{font-size:clamp(42px,5vw,70px);letter-spacing:-.055em;font-weight:950;color:#fff;text-shadow:0 4px 22px #0006;margin-top:7px}.ark-score strong i{font-style:normal;font-size:24px;color:var(--accent);margin-left:6px}.ark-run-meta{text-align:right;padding:13px 16px;background:#0c1626c9;border:1px solid #697b9547;border-radius:13px;min-width:150px}.ark-run-meta b{font-size:22px;letter-spacing:-.02em}.ark-run-meta span{font-size:10px;display:block;color:#bbcae0;margin-top:3px}.ark-meter{height:5px;width:100%;background:#44516470;border-radius:6px;margin-top:12px;overflow:hidden}.ark-meter div{height:100%;background:var(--accent);width:100%;transform-origin:left;transition:transform .08s linear}
.ark-controls{position:absolute;bottom:25px;left:50%;transform:translateX(-50%);z-index:4;display:flex;flex-direction:column;align-items:center;gap:10px;width:min(540px,calc(100% - 32px))}.ark-control-row{display:flex;align-items:center;justify-content:center;gap:10px;width:100%}.ark-hold{min-height:54px;border:1px solid #70819b70;border-bottom:4px solid #0007;border-radius:13px;background:#12233bed;color:#ecf5ff;font-size:19px;font-weight:850;padding:10px 24px;touch-action:none;user-select:none;-webkit-user-select:none}.ark-hold[data-key=action]{background:var(--accent);color:var(--ink);font-size:13px;font-weight:950;min-width:200px;border-color:#fffffe30;position:relative;overflow:hidden}.ark-hold:active,.ark-hold.is-held{transform:translateY(2px);filter:brightness(1.15);border-bottom-width:2px}.ark-control-hint{background:#081423af;border:1px solid #8097b32a;padding:6px 14px;border-radius:20px;color:#bfcee3;font-size:10px;text-align:center}.ark-context{position:absolute;left:50%;top:77%;transform:translate(-50%,-50%);padding:7px 16px;border-radius:7px;background:#061120cf;color:var(--accent);font-weight:850;font-size:13px;letter-spacing:.04em;white-space:nowrap;pointer-events:none;z-index:3;transition:opacity .15s}.ark-pop{position:absolute;top:31%;left:50%;transform:translate(-50%,0) rotate(-4deg);font-size:clamp(22px,3vw,38px);font-weight:950;color:var(--accent);text-shadow:0 3px 0 #081522,0 0 24px #0008;letter-spacing:-.03em;pointer-events:none;z-index:5;opacity:0}.ark-pop.show{animation:ark-pop .8s both}@keyframes ark-pop{0%{opacity:0;transform:translate(-50%,15px) scale(.75) rotate(-4deg)}18%{opacity:1;transform:translate(-50%,0) scale(1.1) rotate(-4deg)}60%{opacity:1}100%{opacity:0;transform:translate(-50%,-16px) scale(1) rotate(-4deg)}}
.ark-modal{position:absolute;inset:0;background:#040a16d9;display:grid;place-items:center;z-index:20;padding:20px}.ark-modal-inner{width:min(500px,100%);max-height:calc(100% - 10px);overflow-y:auto;position:relative;border:1px solid #8796b94f;border-radius:24px;background:radial-gradient(ellipse at 50% 0,color-mix(in srgb,var(--accent) 15%,#132138),transparent 70%),#101b2d;padding:34px 34px 28px;text-align:center;box-shadow:0 32px 120px #0009;animation:ark-result .2s ease-out}.ark-modal-inner h2{font-size:34px;font-weight:950;line-height:1.05;letter-spacing:-.04em;margin:16px 0 10px}.ark-modal-inner p{color:#b5c5dd;line-height:1.65;font-size:13px;margin:12px 0 22px}.ark-result-badge{width:78px;height:78px;display:grid;place-items:center;margin:0 auto 18px;border:2px solid var(--accent);border-radius:24px;transform:rotate(-8deg);background:color-mix(in srgb,var(--accent) 10%,transparent);font-size:38px;color:var(--accent);font-weight:950}.ark-final-score{font-size:78px;font-weight:950;letter-spacing:-.07em;line-height:1.1;color:var(--accent);margin:10px 0}.ark-final-score span{font-size:16px;margin-left:7px;letter-spacing:0}.ark-result-stats{display:flex;justify-content:center;gap:20px;padding:14px 0;margin-bottom:20px;border-top:1px solid #7189a733;border-bottom:1px solid #7189a733;font-size:11px;color:#a6b7ce}.ark-result-stats strong{display:block;font-size:18px;color:#eff6ff;margin-top:3px}.ark-result-actions{display:grid;gap:10px}.ark-secondary{min-height:46px;padding:9px 15px;color:#cbd7e8;border:1px solid #8da1bf55;background:#1c2b4380;border-radius:10px;font-weight:750}.ark-secondary:hover{background:#334865}.ark-smallprint{font-size:10px!important;color:#8e9eb6!important;margin:14px 0 0!important}.ark-help-list{text-align:left;padding:0;margin:18px 0;list-style:none;counter-reset:step}.ark-help-list li{counter-increment:step;display:flex;gap:10px;align-items:center;font-size:13px;color:#d1dced;margin:14px 0}.ark-help-list li:before{content:counter(step);background:var(--accent);color:var(--ink);flex:0 0 28px;height:28px;display:grid;place-items:center;border-radius:8px;font-weight:850}.ark-error{position:absolute;z-index:40;inset:0;display:grid;place-items:center;padding:30px;background:#101b2d}.ark-error>div{max-width:450px}.ark-error h2{font-size:24px}.ark-error p{color:#bbcae1}.ark-saving-warning{position:absolute;bottom:3px;right:12px;font-size:9px;z-index:5;color:#b1bfd1;pointer-events:none}.ark-game[data-phase=run] .ark-mission,.ark-game[data-phase=run] .ark-record,.ark-game[data-phase=result] .ark-mission,.ark-game[data-phase=result] .ark-record{display:none}.ark-game[data-phase=build] .ark-live,.ark-game[data-phase=build] .ark-controls,.ark-game[data-phase=build] .ark-context{display:none}.ark-game:not([data-phase=build]) .ark-build{display:none}
@keyframes ark-result{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
@media(min-width:1600px){.ark-mission{left:50px;top:118px;width:345px}.ark-mission p{max-width:290px;font-size:14px}.ark-top{left:40px;right:40px}.ark-record{right:46px;top:114px}.ark-build{bottom:32px;gap:16px}.ark-field{padding:17px}.ark-choice{min-height:64px}.ark-choice strong{font-size:13px}.ark-choice span{font-size:10px}.ark-primary{min-height:70px;font-size:17px}}
@media(max-width:1000px) and (min-width:701px){.ark-mission{left:24px;width:210px;top:90px}.ark-mission h1{font-size:35px}.ark-mission p{font-size:11px}.ark-record{right:24px;top:90px}.ark-build{left:18px;right:18px;gap:8px;grid-template-columns:repeat(3,minmax(0,1fr)) 145px}.ark-field{padding:10px}.ark-choice strong{font-size:10px}.ark-choice span{font-size:8px}.ark-primary{font-size:13px;padding:10px}}
@media(max-width:700px){.ark-game{flex-basis:670px}.ark-top{inset:12px 14px auto;gap:8px}.ark-brand{font-size:9px;gap:7px}.ark-brand-mark{width:34px;height:36px;font-size:19px;border-radius:9px}.ark-brand small{font-size:7px;letter-spacing:.13em}.ark-tools{gap:4px}.ark-icon{height:40px;min-width:38px;border-radius:10px;padding:0 7px;font-size:10px}.ark-icon svg{width:16px;height:16px}.ark-icon.ark-quality{display:none}.ark-mission{left:18px;top:73px;right:18px;width:auto}.ark-kicker{font-size:8px;letter-spacing:.16em}.ark-mission h1{font-size:32px;letter-spacing:-.055em;margin:7px 0 9px;max-width:255px;line-height:1}.ark-mission p{font-size:10px;line-height:1.5;max-width:205px}.ark-mission .ark-stamp{display:none}.ark-record{right:16px;top:83px;gap:2px;max-width:112px}.ark-record small{font-size:7px}.ark-record strong{font-size:19px}.ark-record em{font-size:8px}.ark-mode{margin-top:8px;padding:3px;gap:0;border-radius:8px}.ark-mode button{font-size:8px;min-height:30px;padding:0 7px}.ark-build{left:12px;right:12px;bottom:14px;display:grid;grid-template-columns:1fr;gap:5px}.ark-field{padding:7px 9px;border-radius:11px;display:grid;grid-template-columns:82px 1fr;align-items:center;gap:7px}.ark-field-title{font-size:8px;letter-spacing:.04em;margin:0;gap:5px;line-height:1.5}.ark-choices{gap:4px}.ark-choice{min-height:44px;padding:3px 1px;border-radius:7px;gap:1px}.ark-choice strong{font-size:9px}.ark-choice span{font-size:7px}.ark-launch-wrap{gap:0;margin-top:4px}.ark-launch-wrap small{display:none}.ark-primary{min-height:49px;font-size:13px;border-radius:10px;padding:10px}.ark-live{inset:74px 18px auto}.ark-score small{font-size:8px}.ark-score strong{font-size:43px}.ark-run-meta{padding:10px 12px;min-width:112px;border-radius:11px}.ark-run-meta b{font-size:18px}.ark-run-meta span{font-size:8px}.ark-meter{margin-top:8px;height:4px}.ark-controls{bottom:25px;gap:8px;width:calc(100% - 30px)}.ark-control-row{gap:7px}.ark-hold{padding:10px 15px;flex:1;min-height:56px;border-radius:11px}.ark-hold[data-key=action]{min-width:168px;flex:3;font-size:11px}.ark-control-hint{font-size:9px;padding:6px 9px;max-width:100%}.ark-context{top:auto;bottom:124px;transform:translateX(-50%);font-size:11px;max-width:95%;overflow:hidden;text-overflow:ellipsis}.ark-pop{top:33%;font-size:27px;width:95%;text-align:center}.ark-modal{padding:15px}.ark-modal-inner{padding:26px 22px 22px;border-radius:20px}.ark-modal-inner h2{font-size:28px;margin:12px 0 8px}.ark-final-score{font-size:66px}.ark-result-badge{width:62px;height:62px;border-radius:18px;font-size:30px;margin-bottom:15px}.ark-result-stats{gap:20px;padding:11px 0;margin-bottom:16px}.ark-modal-inner p{font-size:12px}.ark-saving-warning{font-size:8px;bottom:1px;right:8px}}
@media(max-height:720px) and (min-width:701px){.ark-mission{top:84px}.ark-mission h1{font-size:37px;margin:10px 0}.ark-mission .ark-stamp{margin-top:12px}.ark-record{top:88px}.ark-build{bottom:17px}.ark-field{padding:10px 12px}.ark-choice{min-height:48px}.ark-live{top:82px}.ark-controls{bottom:18px}.ark-context{top:73%}}
@media(prefers-reduced-motion:reduce){.ark-game *{animation-duration:.001s!important;transition:none!important}.ark-choice:hover,.ark-primary:hover,.ark-icon:hover{transform:none}}
.ark-game[data-motion=off] *{animation-duration:.001s!important;transition:none!important}
