:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;color:#183b39;background:#f7f7f2;font-synthesis:none;--green:#183b39;--muted:#7b8881;--line:#e1e6dd;--peach:#e8b9a1}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}a{color:inherit;text-decoration:none}[hidden]{display:none!important}button:focus-visible,a:focus-visible{outline:2px solid #c67c50;outline-offset:4px}input:focus{outline:none}.muted{color:var(--muted);font-size:14px;line-height:1.8}.eyebrow{font-size:11px;font-weight:650;letter-spacing:2px;text-transform:uppercase}.error{color:#a83b35;font-size:13px;min-height:18px;margin:12px 0}.primary{background:var(--green);color:#fff;border:0;border-radius:10px;padding:15px 18px;display:flex;justify-content:space-between;font-weight:600}
.login-view{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;background:radial-gradient(ellipse at 15% 0,#e1e7d7 0,transparent 55%),radial-gradient(ellipse at 100% 100%,#ead8ca 0,transparent 50%),#f7f7f2}.login-brand{display:flex;align-items:center;gap:11px;font-size:12px;font-weight:750;letter-spacing:3px;margin-bottom:38px}.login-brand img{width:36px}.login-card{width:min(440px,100%);background:#fffffc;border:1px solid #e4e7dc;border-radius:20px;padding:38px;box-shadow:0 25px 70px #183b3910}.login-card h1{font-size:28px;letter-spacing:-1px;line-height:1.4;margin:15px 0 8px}.login-card .eyebrow{color:#a47350}.login-card form{margin-top:30px}.login-card label{display:block;font-size:12px;font-weight:600;margin:20px 0 9px}.login-card input{width:100%;border:1px solid #dce2d9;background:#fafbf7;padding:13px 14px;border-radius:9px}.login-card input:focus{border-color:#6b8d7c;box-shadow:0 0 0 3px #6b8d7c12}.login-card button{width:100%;margin-top:16px}.login-foot{font-size:9px;letter-spacing:2px;color:#8d9c92;margin-top:28px}
#browser-view{height:100svh;display:flex;flex-direction:column}.browser-header{height:72px;display:flex;align-items:center;padding:0 30px;border-bottom:1px solid var(--line);flex-shrink:0;background:#fffffc}.brand{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:700}.brand img{width:35px}.brand small{font-size:9px;letter-spacing:1.8px;margin-left:10px;font-weight:600}.header-tag{color:#8b9690;font-size:11px;margin-left:34px;border-left:1px solid var(--line);padding-left:26px}.text-button{background:none;border:0;font-size:12px;color:#718078;padding:12px 0;margin-left:auto}.toolbar{display:flex;align-items:center;gap:16px;padding:14px 28px;background:#fffffc;flex-shrink:0}.navigation{display:flex;gap:3px}.navigation button{border:0;background:transparent;color:#6e8079;width:31px;height:34px;font-size:21px;border-radius:7px}.navigation button:hover{background:#f0f3ec;color:var(--green)}#address-form{display:flex;align-items:center;gap:10px;background:#f4f6f0;border:1px solid #e5e9df;border-radius:10px;flex:1;padding:4px 5px 4px 14px;min-width:0}#address-form:focus-within{border-color:#a1b5a2}.address-icon{color:#91a48f;font-size:19px}#address{border:0;background:none;color:var(--green);font-size:13px;min-width:0;flex:1;height:34px}#address::placeholder{color:#95a094}#go{border:0;border-radius:7px;background:var(--green);color:white;font-size:11px;padding:10px 15px;white-space:nowrap}#go span{margin-left:14px}.status{font-size:10px;color:#7b8d7e;display:flex;gap:6px;align-items:center;min-width:72px;white-space:nowrap}.status i,.tiny-dot{display:inline-block;width:5px;height:5px;background:#729376;border-radius:50%;flex-shrink:0}.status i.loading{background:#c29b67;animation:pulse 1s infinite}.status i.error{background:#b65743;min-height:0;margin:0}.status i.ready{background:#618c69}#loading-line{height:2px;background:transparent;flex-shrink:0}#loading-line.active{background:linear-gradient(90deg,transparent,#92ad8c,transparent);background-size:40% 100%;background-repeat:no-repeat;animation:progress 1.5s infinite}#notice{background:#fff3e8;border-bottom:1px solid #ecd3be;color:#80542d;padding:12px 28px;font-size:13px;line-height:1.6}
#viewport{flex:1;min-height:0;position:relative;background:#fff}#viewport iframe{width:100%;height:100%;display:block;border:0;background:white}#start-page{height:100%;overflow:auto;background:radial-gradient(ellipse at 25% 80%,#ecf0e3,transparent 65%),#f7f7f2;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:80px;padding:7vh max(5vw,35px)}.hero .eyebrow{color:#688069;display:flex;align-items:center;gap:9px}.hero h1{font-size:clamp(45px,5.8vw,86px);letter-spacing:-3px;line-height:1.16;font-weight:550;margin:28px 0}.hero h1 em{font-style:normal;color:#b18160}.hero>p:last-child{color:#7e8b80;font-size:14px;line-height:1.9}.shortcut-area{max-width:480px;width:100%;justify-self:end}.section-label{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;color:#7c8d7e;margin-bottom:16px}.shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:12px}.shortcuts a{background:#ffffffc9;border:1px solid #e1e5da;border-radius:13px;padding:25px 20px;position:relative;transition:transform .18s,border-color .18s,background .18s}.shortcuts a:hover{transform:translateY(-3px);border-color:#a4b4a0;background:#fff}.site-icon{width:35px;height:35px;display:flex;align-items:center;justify-content:center;border-radius:10px;font-size:12px;font-weight:750;margin-bottom:22px}.github{background:#e7ebe3;color:#2d483f}.chatgpt{background:#e0eee3;color:#568065;font-size:27px}.google{background:#e9e9e0;color:#72775d;font-size:21px}.youtube{background:#f2e5dc;color:#b77b59;font-size:16px}.shortcuts strong{display:block;font-size:15px;font-weight:600}.shortcuts small{display:block;font-size:10px;color:#99a093;margin-top:5px}.shortcuts .arrow{position:absolute;right:20px;top:25px;color:#9caa96;font-size:17px}.start-note{display:flex;gap:14px;border-top:1px solid #dfe4d7;margin-top:25px;padding-top:18px;color:#91a088}.start-note>span{font-size:25px}.start-note p{margin:0;font-size:10px;line-height:1.9}.start-note code{font:inherit;color:#637b62}.browser-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px 28px;border-top:1px solid var(--line);background:#fffffc;font-size:9px;letter-spacing:.5px;color:#89978a;flex-shrink:0}.browser-footer>span:first-child{display:flex;gap:7px;align-items:center}#page-host{text-transform:uppercase;color:#779076;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@keyframes pulse{50%{opacity:.35}}@keyframes progress{from{background-position:-60% 0}to{background-position:160% 0}}
@media(max-width:850px){.header-tag{display:none}#start-page{gap:30px;padding:35px;grid-template-columns:1fr 1fr}.hero h1{font-size:52px}.toolbar{gap:8px;padding:10px 16px}.status{display:none}.browser-header{height:61px;padding:0 20px}.browser-footer{padding:10px 18px}}@media(max-width:580px){.brand small{display:none}.navigation{gap:0}.navigation button{width:26px}#go{font-size:0;padding:10px 12px}#go span{font-size:14px;margin:0}#address-form{gap:5px;padding-left:8px}#address{font-size:12px}#start-page{display:block;padding:38px 27px}.hero h1{font-size:48px;margin:21px 0}.hero>p:last-child{font-size:12px}.hero br:first-of-type{display:none}.shortcut-area{margin-top:35px;max-width:none}.shortcuts a{padding:20px 17px}.site-icon{margin-bottom:16px}.browser-footer>span:last-child{display:none}.login-card{padding:30px 25px}.login-card h1{font-size:25px}#notice{padding:10px 18px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
