:root{font-family:Inter,Segoe UI,sans-serif;color:#182c2b;background:#f4f6f2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}header,footer{max-width:1240px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:28px 40px}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:inherit;font-size:25px;font-weight:750;letter-spacing:-1px}.logo{display:grid;place-items:center;width:36px;height:36px;background:#215b4c;color:#fff;border-radius:11px;font-size:28px}.badge{font-size:10px;letter-spacing:1px;border:1px solid #bac9ba;border-radius:5px;padding:4px 6px;margin-left:5px}.phase,footer{font-size:12px;color:#6a7c75}.phase{font-family:monospace}main{max-width:1240px;margin:45px auto 60px;padding:0 40px;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:700;color:#547b66}h1{font-size:clamp(44px,5vw,66px);line-height:1.09;letter-spacing:-3px;margin:26px 0}h1 span{color:#36745b}.lead{font-size:17px;color:#61716a;line-height:1.7;max-width:410px}.features{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0;font-size:11px;color:#365c4d}.features span{background:#e7eee4;padding:8px 10px;border-radius:6px}.note{max-width:410px;border-top:1px solid #d7dfd5;padding-top:24px;margin-top:45px;font-size:12px;line-height:1.7;color:#6d7b71}.note strong{color:#415b4e}.workspace{background:#fff;border:1px solid #e0e7dd;border-radius:20px;padding:28px;box-shadow:0 16px 48px #193e3110}.panel-head{display:flex;gap:10px;align-items:center;justify-content:space-between;border-bottom:1px solid #edf0eb;padding-bottom:24px;margin-bottom:30px}#status{font-size:10px;color:#5d7166;background:#edf2e9;padding:6px 9px;border-radius:20px}h2{font-size:23px;letter-spacing:-.7px;margin:0 0 12px}.workspace p{color:#6c7971;font-size:13px;line-height:1.7}button,input{font:inherit}button{cursor:pointer;border:0;border-radius:9px;font-size:13px;font-weight:650;transition:background .15s}button:disabled{opacity:.5;cursor:wait}.primary{background:#245e4b;color:white;padding:15px 18px;display:flex;justify-content:space-between;gap:18px}.primary:hover{background:#194b3a}#create{width:100%;margin-top:26px}.secondary{width:100%;background:#eef3e9;color:#31543e;padding:15px;margin-top:12px}.divider{display:flex;align-items:center;gap:12px;color:#9aa59b;font-size:11px;margin:28px 0}.divider:before,.divider:after{content:'';height:1px;background:#edf0e9;flex:1}label{display:block;font-size:12px;font-weight:600;margin-bottom:9px}input{width:100%;border:1px solid #dbe3d8;border-radius:8px;padding:13px;background:#fafbf8;color:#243e30}input:focus{outline:2px solid #93b59b;outline-offset:2px}#code,#invite-code{letter-spacing:2px;text-transform:uppercase;font-family:monospace}#message{color:#a13c31;font-size:12px;margin-bottom:0}.room-title,.history-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.text-button{background:transparent;color:#3a7058;padding:6px 0;font-size:11px;display:block}.invite-row{display:flex;gap:12px;align-items:center}.invite-row p{font-size:11px}#invitation{border:1px solid #e5eadf;border-radius:10px;padding:15px;margin:20px 0}.letter-stage{background:#f0f5ea;text-align:center;border-radius:12px;padding:24px 10px;margin:20px 0}#last{font-size:80px;font-weight:650;line-height:1.3;color:#276344}#sequence,small{font-size:10px;color:#74816e}.send-row{display:flex;gap:10px}.send-row input{min-width:0}.send-row button{flex-shrink:0}small{display:block;line-height:1.5;margin-top:8px}.history-head{margin-top:24px}h3{font-size:12px}#count{font-size:10px;color:#7b897b}ol{list-style:none;padding:0;margin:0;max-height:220px;overflow:auto}li{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #eef1e9;padding:10px 2px;font-size:11px;color:#7b887a}li b{font-size:20px;color:#365e42}footer{border-top:1px solid #dde4d8;padding-top:20px}[hidden]{display:none!important}@media(max-width:850px){main{gap:35px;grid-template-columns:1fr;max-width:600px;margin-top:20px;padding:0 22px}.intro h1{font-size:48px}.intro .note{margin-top:22px}header,footer{padding:22px}.workspace{padding:22px}.invite-row{flex-wrap:wrap}footer{gap:20px}}
