:root{--ink:#17332d;--muted:#667a75;--cream:#f7faf6;--paper:#fff;--green:#2f7d67;--green-dark:#1f5c4d;--lime:#dff2a3;--orange:#f3a34a;--border:#dce7e1;--danger:#9d3b32;--shadow:0 18px 50px rgba(23,51,45,.1)}
*{box-sizing:border-box}html{font-size:16px}body{margin:0;background:var(--cream);color:var(--ink);font-family:Inter,"Noto Sans JP","Yu Gothic UI",sans-serif;min-height:100vh}.app-header{height:78px;padding:12px clamp(18px,4vw,56px);display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.94);border-bottom:1px solid var(--border)}.brand{display:flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none}.brand-mark{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:var(--green);color:#fff;font-weight:800;letter-spacing:-1px}.brand strong{display:block;font-size:1.12rem}.brand small{display:block;color:var(--muted);font-size:.74rem}.loop-label{font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--green);font-weight:700}.app-footer{padding:18px;text-align:center;font-size:.78rem;color:var(--muted);border-top:1px solid var(--border);background:#fff}.welcome-shell{max-width:1240px;margin:0 auto;min-height:calc(100vh - 145px);padding:clamp(44px,8vw,110px) 24px;display:grid;grid-template-columns:1.4fr .75fr;gap:70px;align-items:center}.eyebrow{color:var(--green);font-weight:800;letter-spacing:.18em;font-size:.78rem}.hero-copy h1{font-size:clamp(2.5rem,5vw,4.8rem);line-height:1.12;letter-spacing:-.055em;margin:16px 0 25px}.hero-copy>p{font-size:1.14rem;line-height:1.9;color:var(--muted);max-width:660px}.loop-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:35px}.loop-cards span{padding:18px 10px;border-top:2px solid var(--green);font-weight:700}.loop-cards b{display:block;font-size:.68rem;color:var(--green);margin-bottom:7px}.start-card{background:var(--paper);padding:34px;border-radius:28px;box-shadow:var(--shadow);border:1px solid rgba(220,231,225,.7)}.start-card h2{font-size:1.65rem;margin-bottom:24px}.start-card label{font-size:.78rem;font-weight:800;margin-bottom:8px}.btn-kitchen{width:100%;min-height:58px;margin-top:14px;border-radius:14px;font-weight:800}.btn-primary{background:var(--green);border-color:var(--green)}.btn-primary:hover{background:var(--green-dark);border-color:var(--green-dark)}.privacy-note{color:var(--muted);font-size:.75rem;margin:16px 0 0;text-align:center}.workspace{max-width:1500px;margin:0 auto;padding:20px clamp(12px,3vw,42px) 40px}.demo-banner{padding:10px;text-align:center;background:#fff1c4;color:#745516;border:1px solid #eed68c;border-radius:12px;margin-bottom:12px;font-weight:700}.status-rail{min-height:36px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px}.status-pill{padding:7px 11px;border-radius:99px;font-size:.75rem;font-weight:700;background:#e9f5ee;color:var(--green)}.status-pill.off{background:#edf0ef;color:#6a7672}.thinking{margin-left:auto;font-size:.78rem;color:var(--muted)}.thinking i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--orange);animation:pulse 1s infinite}.workspace-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(340px,.75fr);gap:20px}.camera-panel,.mentor-panel,.conversation-panel{background:#fff;border:1px solid var(--border);border-radius:24px;box-shadow:0 8px 30px rgba(23,51,45,.06)}.camera-panel{padding:12px}.camera-frame{position:relative;overflow:hidden;border-radius:17px;background:#14221f;aspect-ratio:16/9;display:grid;place-items:center}.camera-frame video{width:100%;height:100%;object-fit:cover}.camera-empty{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:#d9e5e1}.camera-empty span{font-size:3.8rem;color:#88a49c}.live-badge{position:absolute;top:14px;left:14px;background:rgba(18,38,33,.78);color:#fff;border-radius:99px;padding:7px 11px;font-size:.7rem;font-weight:800}.camera-actions{display:flex;gap:8px;padding-top:10px}.camera-actions .btn{flex:1;min-height:46px;border:1px solid var(--border);font-weight:700}.permission-help{color:var(--danger);font-size:.82rem;padding:10px;margin:0}.mentor-panel{padding:24px;display:flex;flex-direction:column}.progress-head{display:flex;justify-content:space-between;font-size:.72rem;font-weight:800;letter-spacing:.08em;color:var(--green)}.progress{height:7px;margin:8px 0 25px;background:#e9efec}.progress-bar{background:var(--green)}.current-label,.observation-card span,.next-action span,.timer-card>span{font-size:.7rem;color:var(--muted);font-weight:800;letter-spacing:.12em;text-transform:uppercase}.mentor-panel h2{font-size:clamp(1.55rem,2.5vw,2.4rem);margin:7px 0 12px;line-height:1.2}.step-instruction{font-size:1.02rem;line-height:1.75}.observation-card{background:#edf6f1;border-radius:16px;padding:16px;margin:10px 0}.observation-card strong{display:block;margin:6px 0;font-size:1rem}.observation-card small{color:var(--muted)}.next-action{border-left:3px solid var(--orange);padding:4px 0 4px 14px;margin:7px 0 16px}.next-action p{margin:4px 0;font-weight:800}.timer-card{margin-top:auto;padding:15px;border:1px solid var(--border);border-radius:16px;display:grid;grid-template-columns:1fr auto;align-items:center}.timer-card strong{font-size:1.8rem;font-variant-numeric:tabular-nums}.timer-card div{grid-column:1/-1;display:flex;gap:6px;margin-top:8px}.timer-card button{flex:1;border:0;border-radius:8px;padding:7px;background:#eef3f1;font-size:.75rem}.command-bar{position:sticky;bottom:10px;z-index:5;margin:18px 0;display:grid;grid-template-columns:1.25fr 1.25fr repeat(4,1fr);gap:8px;padding:10px;background:rgba(255,255,255,.93);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow)}.command{min-height:62px;border:1px solid var(--border);background:#fff;border-radius:13px;color:var(--ink);font-weight:800}.command.primary{background:var(--green);color:#fff;border-color:var(--green)}.command.accent{background:var(--lime);border-color:#cbe57f}.command.danger{color:var(--danger)}.conversation-panel{padding:20px}.conversation-head{display:flex;justify-content:space-between}.conversation-head h3{font-size:1rem}.conversation-head button{border:0;background:none;color:var(--danger);font-size:.75rem}.conversation-log{min-height:90px;max-height:180px;overflow:auto;padding:10px 0}.conversation-log p{margin:7px 0;padding:9px 12px;background:#f1f6f3;border-radius:10px;font-size:.88rem}.conversation-log .user-line{background:#fff3df}.text-input-row{display:flex;border:1px solid var(--border);border-radius:12px;overflow:hidden}.text-input-row input{flex:1;border:0;padding:12px;min-width:0}.text-input-row button{border:0;background:var(--ink);color:#fff;padding:0 22px}.app-toast{position:fixed;right:20px;bottom:20px;z-index:20;max-width:390px;padding:14px 18px;border-radius:12px;background:var(--ink);color:#fff;box-shadow:var(--shadow);transform:translateY(150%);transition:.25s}.app-toast.show{transform:none}@keyframes pulse{50%{opacity:.25}}
@media(max-width:900px){.loop-label{display:none}.welcome-shell{grid-template-columns:1fr;gap:30px;padding-top:55px}.hero-copy h1 br{display:none}.workspace-grid{grid-template-columns:1fr}.mentor-panel{min-height:480px}.command-bar{grid-template-columns:repeat(3,1fr)}.command{min-height:58px}.camera-actions{flex-wrap:wrap}.camera-actions .btn{min-width:30%}}
@media(max-width:560px){.app-header{height:66px;padding:8px 12px}.brand-mark{width:42px;height:42px}.brand small{display:none}.welcome-shell{padding:40px 16px}.hero-copy h1{font-size:2.55rem}.loop-cards{grid-template-columns:1fr 1fr}.start-card{padding:24px;border-radius:20px}.workspace{padding:10px 8px 30px}.workspace-grid{gap:10px}.camera-panel,.mentor-panel,.conversation-panel{border-radius:18px}.camera-frame{aspect-ratio:4/3}.mentor-panel{padding:19px}.command-bar{bottom:4px;grid-template-columns:repeat(2,1fr);gap:6px;margin:10px 0;padding:7px;border-radius:15px}.command.primary,.command.accent{min-height:70px}.timer-card{margin-top:12px}.app-footer{font-size:.7rem}}