@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{font-family:'Noto Sans KR',sans-serif;color:#192f28;background:#f6f7f2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #19a56a;outline-offset:4px}button{color:inherit}header{max-width:1240px;margin:auto;padding:28px 42px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dde3d9}.brand{text-decoration:none;color:#193d2f;font-weight:900;letter-spacing:1px;display:flex;align-items:center;gap:10px;font-size:19px}.brand-icon{font-size:28px;color:#288455}.tag{font-size:9px;letter-spacing:1px;border:1px solid #c9d2c5;padding:5px 7px;border-radius:4px;margin-left:10px}.quiet{background:transparent;border:0;font-size:12px;padding:10px}.intro{padding:50px 0;display:flex;flex-direction:column;align-items:flex-start;position:relative}.eyebrow{font-size:11px;font-weight:800;letter-spacing:2.2px;color:#318551}h1{font-size:clamp(36px,4.2vw,57px);line-height:1.35;letter-spacing:-2.8px;margin:25px 0}h1 span{color:#377950}.intro>p{font-size:14px;color:#728074;line-height:1.9;margin-top:0}.intro-bottom{margin-top:auto;padding-top:65px;font-size:11px;color:#718471;display:flex;align-items:center;gap:8px}.tiny-dot{width:7px;height:7px;background:#59a76c;border-radius:50%}main{max-width:1156px;margin:44px auto 0;display:grid;grid-template-columns:0.9fr 1.1fr;gap:45px}.config{background:white;border:1px solid #e1e5dc;border-radius:20px;padding:28px 30px;box-shadow:0 12px 40px #1d352006}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.section-head h2{font-size:19px;margin:0;letter-spacing:-.8px}.section-head>span{font-size:9px;color:#8b978a;letter-spacing:1px}.label,.label-row{font-size:12px;font-weight:700;margin-bottom:12px}.label-row{display:flex;align-items:center;justify-content:space-between}.label-row>span{font-weight:400;color:#829080;font-size:11px}.modes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:25px}.mode{border:1px solid #e1e6dc;border-radius:11px;background:#fff;padding:14px 4px 12px;font-size:12px;font-weight:700}.mode b{display:block;font-size:24px;height:37px;font-weight:800}.mode small{display:block;font-size:9px;font-weight:400;color:#819080;margin-top:5px}.mode.active{background:#eef5e9;border:1.5px solid #56834b}.choices{display:flex;gap:9px;flex-wrap:wrap}.chip{background:var(--c);border:3px solid transparent;border-radius:50%;width:39px;height:39px;position:relative;box-shadow:0 0 0 1px #0001;color:white;display:grid;place-items:center;font-size:17px;font-weight:800}.chip:not(.selected){opacity:.25}.chip.selected{outline:2px solid #fff;outline-offset:-5px}.chip.number{background:#eff3eb;color:#1e3b2b;border-radius:8px;box-shadow:none;opacity:1;border:1px solid #e4e9df}.chip.number.selected{background:#264f38;color:#fff}.hint{font-size:10px;color:#83907e;margin:10px 0 0}.divider{border-top:1px solid #edf0e9;margin:24px 0 20px}.segmented{display:flex;background:#f1f3ed;padding:3px;border-radius:6px}.segmented button{border:0;background:transparent;font-size:10px;padding:5px 12px;border-radius:4px;color:#7b8978}.segmented .active{background:#fff;color:#284a32;box-shadow:0 1px 4px #0001}.time-row{display:flex;gap:12px;align-items:center}.time-row>div{flex:1;min-width:0}.time-row label{font-size:10px;color:#7a8976;display:block;margin-bottom:7px}.input-unit{display:flex;align-items:center;border:1px solid #e1e6db;border-radius:8px;padding-right:12px;height:43px}.input-unit input{width:100%;min-width:0;border:0;background:transparent;padding:10px 12px;font-size:15px;outline-offset:0}.input-unit span{font-size:11px;color:#8b9784}select{height:43px;width:100%;font-size:12px;border:1px solid #e1e6db;border-radius:8px;background:white;padding:0 9px}.options{display:flex;gap:13px;flex-wrap:wrap;margin:20px 0 0;font-size:10px;color:#5d6d58}.options label{display:flex;gap:4px;align-items:center;cursor:pointer}input[type=checkbox]{accent-color:#316340}.start{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;border-radius:9px;background:#244f35;color:white;padding:16px 20px;font-size:14px;font-weight:700}.start:hover{background:#183f29}.start span{font-size:20px}.footnote{text-align:center;font-size:9px;color:#8d9988;margin:12px 0 0}#error{color:#b44738;font-size:11px;margin:10px 0;min-height:4px}.tips{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);padding:26px 0 34px;border-top:1px solid #dfe5d9;margin-top:6px}.tips>div{padding-left:28px;border-left:1px solid #dfe5d9}.tips>div:first-child{padding-left:0;border:0}.tips span{font-size:11px;font-weight:800;color:#769469;margin-right:15px}.tips b{font-size:12px}.tips p{font-size:11px;color:#87917f;line-height:1.8;margin:9px 0 0 32px}footer{max-width:1156px;margin:0 auto;padding:18px 0 26px;border-top:1px solid #e0e5d9;font-size:11px;font-weight:700;display:flex;align-items:center;gap:18px}footer span{font-weight:400;color:#919b88;font-size:10px}footer button{margin-left:auto;border:0;background:none;font-size:10px;color:#73816b}[hidden]{display:none!important}#training{position:fixed;inset:0;background:#132d25;z-index:10;color:white;touch-action:manipulation}#stimulus{position:absolute;inset:0;display:grid;place-items:center;font-weight:900;font-size:min(56vw,68vh);line-height:1}.signal-circle{width:min(62vw,60vh);height:min(62vw,60vh);border-radius:50%;background:var(--c);box-shadow:0 0 75px color-mix(in srgb,var(--c) 22%,transparent)}.train-top,.train-bottom{position:absolute;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:24px max(24px,env(safe-area-inset-right));font-size:14px;gap:10px;text-shadow:0 1px 4px #0007}.train-top{top:0;background:linear-gradient(#0004,transparent)}.train-bottom{bottom:0;background:linear-gradient(transparent,#0004);transition:opacity .2s}.train-bottom button{background:#14241dbb;color:#fff;border:1px solid #fff4;border-radius:8px;padding:10px 15px;font-size:12px;margin-left:7px}.train-bottom.hide{opacity:0;pointer-events:none}#countdown{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(60px,22vw,200px);font-weight:900;pointer-events:none}dialog{border:1px solid #dfe5d9;border-radius:18px;padding:35px;max-width:480px;width:calc(100% - 32px);color:#213e2b;background:#fbfcf8}dialog::backdrop{background:#0b201c99;backdrop-filter:blur(4px)}dialog h2{font-size:23px;letter-spacing:-1px}dialog p{font-size:12px;color:#6d7e66;line-height:1.9}dialog .close{float:right;border:0;background:none}#summary .quiet{display:block;margin:14px auto 0}
@media(max-width:850px){header{padding:20px 24px}.tag{display:none}main{margin:20px 24px 0;gap:22px;grid-template-columns:1fr}.intro{padding:12px 0}.intro h1{font-size:37px;margin:14px 0;line-height:1.3}.intro h1 br{display:none}.intro>p{font-size:12px;margin-bottom:0}.intro-bottom{display:none}.config{padding:23px}.tips{margin-top:10px}.brand{font-size:16px}footer{margin:0 24px}.tips>div{padding-left:13px}.tips p{margin-left:0;font-size:10px}.tips span{margin-right:6px}.tips b{font-size:11px}}@media(max-width:420px){header{padding:16px}.quiet{font-size:10px}main{margin:20px 16px 0}.config{padding:20px 16px}.intro h1{font-size:32px}.options{gap:7px}.train-bottom{padding:16px 10px;font-size:11px}.train-bottom button{padding:10px;font-size:11px;margin-left:3px}footer span{display:none}}

.modes{grid-template-columns:repeat(4,1fr)}.mode small{font-size:8px}.chip.number[aria-label="STOP!"],.chip.number[aria-label="GO!"]{width:78px;font-size:14px}.voice-toggle{font-size:11px;color:#5d6d58;display:inline-flex;gap:5px;align-items:center}.traffic-light{background:#070b09;border:3px solid #334039;border-radius:50px;padding:22px;display:flex;flex-direction:column;gap:16px;box-shadow:0 16px 80px #0008}.lamp{width:min(23vw,20vh);height:min(23vw,20vh);border-radius:50%;background:#27312b;box-shadow:inset 0 3px 12px #0008}.lamp.lit{background:var(--c);box-shadow:0 0 45px color-mix(in srgb,var(--c) 45%,transparent)}@media(max-width:420px){.mode{font-size:11px}.mode small{font-size:7px}}

#voiceOptions .chip{width:80px}#choices .chip.number{min-width:39px;width:auto;padding:0 12px}

.mode{color:#244f35}.mode b{color:#377950;-webkit-text-fill-color:#377950}.mode.active b{color:#244f35;-webkit-text-fill-color:#244f35}

.brand img.brand-icon{width:40px;height:40px;object-fit:contain;border-radius:9px}.brand-name{letter-spacing:-.3px;font-size:clamp(12px,1.6vw,18px)}@media(max-width:420px){header{gap:8px}.brand{gap:7px}.brand img.brand-icon{width:34px;height:34px}header .quiet{padding:8px 0;font-size:10px;white-space:nowrap}}