*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;font-family:var(--display-font, "Segoe UI", system-ui, sans-serif);background:var(--bg-primary, #1e1e1e);color:var(--text-primary, #ffffff);transition:background .3s,color .3s}.page{min-height:100%;display:flex;align-items:center;justify-content:center}.calculator-page{padding:1rem}.calculator{position:relative;width:100%;max-width:380px;background:var(--bg-secondary, #2d2d2d);border-radius:16px;padding:1.25rem;box-shadow:var(--shadow, 0 8px 32px rgba(0, 0, 0, .4));border:1px solid var(--border-color, #444);transition:max-width .3s,background .3s,box-shadow .3s}.calculator.scientific{max-width:720px}.mode-toggle{display:flex;justify-content:center;gap:0;margin-bottom:.6rem}.mode-btn{font-family:inherit;font-size:.72rem;font-weight:600;letter-spacing:.04em;padding:.28rem .9rem;border:1px solid var(--border-color, #444);background:var(--btn-bg, #3a3a3a);color:var(--text-secondary, #b0b0b0);cursor:pointer;transition:background .15s,color .15s,border-color .15s}.mode-btn:first-child{border-radius:6px 0 0 6px;border-right:none}.mode-btn:last-child{border-radius:0 6px 6px 0}.mode-btn.active{background:var(--btn-operator, #ff9500);color:var(--btn-operator-text, #fff);border-color:var(--btn-operator, #ff9500)}.mode-btn:hover:not(.active){background:var(--btn-bg-hover, #4a4a4a)}.display{background:var(--bg-display, #111);border-radius:12px;padding:1rem 1.25rem;margin-bottom:1rem;min-height:90px;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;overflow:hidden;border:1px solid var(--border-color, #444)}.display-indicators{display:flex;gap:10px;width:100%;margin-bottom:2px}.indicator{font-size:.65rem;font-weight:600;letter-spacing:.05em;color:var(--text-secondary, #b0b0b0);opacity:.85}.display-expression{font-size:.95rem;color:var(--text-secondary, #b0b0b0);min-height:1.4em;word-break:break-all;text-align:right;width:100%}.display-result{font-size:2.2rem;font-weight:600;color:var(--text-primary, #fff);word-break:break-all;text-align:right;width:100%;line-height:1.2}.btn-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.calculator.scientific .btn-grid{grid-template-columns:repeat(10,1fr);gap:5px}.calc-btn{font-family:inherit;font-size:1.1rem;font-weight:500;padding:.85rem 0;border:none;border-radius:10px;cursor:pointer;background:var(--btn-bg, #3a3a3a);color:var(--text-primary, #fff);transition:background .15s,transform .1s;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.calc-btn:hover{background:var(--btn-bg-hover, #4a4a4a)}.calc-btn:active{transform:scale(.95)}.calc-btn.operator{background:var(--btn-operator, #ff9500);color:var(--btn-operator-text, #fff);font-size:1.3rem}.calc-btn.operator:hover{filter:brightness(1.15)}.calc-btn.equals{background:var(--btn-equals, #ff9500);color:var(--btn-equals-text, #fff);font-size:1.3rem}.calc-btn.equals:hover{filter:brightness(1.15)}.calc-btn.clear{background:var(--btn-clear, #d32f2f);color:var(--btn-clear-text, #fff)}.calc-btn.clear:hover{filter:brightness(1.15)}.calc-btn.scientific{background:var(--btn-scientific, #505050);color:var(--btn-scientific-text, #fff);font-size:.95rem}.calc-btn.scientific:hover{filter:brightness(1.2)}.calc-btn.func{background:var(--btn-scientific, #505050);color:var(--btn-scientific-text, #fff);font-size:1.1rem}.calc-btn.func:hover{filter:brightness(1.2)}.calc-btn.rad-deg{text-transform:none}.calculator.scientific .calc-btn{padding:.65rem .1rem;font-size:.95rem;border-radius:8px}.calculator.scientific .calc-btn.scientific{font-size:.78rem;padding:.65rem .15rem}.calculator.scientific .calc-btn.operator,.calculator.scientific .calc-btn.equals{font-size:1.05rem}.calculator.scientific .calc-btn.clear{font-size:.85rem}.skin-bar{display:flex;gap:8px;justify-content:center;margin-bottom:.75rem}.skin-btn{width:28px;height:28px;border-radius:50%;border:2px solid var(--border-color, #444);background:var(--swatch, #888);cursor:pointer;padding:0;transition:transform .15s,box-shadow .15s;box-shadow:none}.skin-btn:hover{transform:scale(1.15)}.skin-btn-active{box-shadow:0 0 0 3px var(--bg-secondary, #2d2d2d),0 0 0 5px var(--swatch, #888);transform:scale(1.1)}.workspace{min-height:100vh;background:#000;color:#fff;font-family:Segoe UI,system-ui,sans-serif;padding:1.5rem 2rem}.workspace-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}.workspace-logo{font-size:1.4rem;font-weight:700;letter-spacing:.02em}.logout-btn{font-family:inherit;padding:.4rem 1rem;border:1px solid #333;border-radius:6px;background:#111;color:#aaa;cursor:pointer;font-size:.8rem;transition:background .15s,color .15s}.logout-btn:hover{background:#222;color:#fff}.site-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}.site-card{background:#111;border:1px solid #222;border-radius:12px;overflow:hidden;cursor:pointer;transition:transform .2s,border-color .2s}.site-card:hover{transform:translateY(-4px);border-color:#444}.site-card:focus-visible{outline:2px solid #fff;outline-offset:2px}.site-card-thumb{width:100%;aspect-ratio:16 / 10;background:#0a0a0a;overflow:hidden}.site-card-thumb img{width:100%;height:100%;object-fit:cover;display:block}.site-card-info{padding:1rem 1.15rem}.site-card-info h2{font-size:1rem;font-weight:600;margin-bottom:.3rem;color:#fff}.site-card-info p{font-size:.8rem;color:#777;line-height:1.4}.frame-layout{display:flex;flex-direction:column;height:100vh;background:#000;font-family:Segoe UI,system-ui,sans-serif}.frame-nav{display:flex;align-items:center;gap:.75rem;padding:.4rem .75rem;background:#0a0a0a;border-bottom:1px solid #1a1a1a;flex-shrink:0}.frame-nav-title{font-size:.8rem;font-weight:600;color:#ccc;margin-right:auto}.frame-nav-links{display:flex;gap:.4rem}.frame-nav-btn{font-family:inherit;font-size:.75rem;padding:.3rem .65rem;border:1px solid #222;border-radius:5px;background:#111;color:#999;cursor:pointer;transition:background .15s,color .15s;white-space:nowrap}.frame-nav-btn:hover{background:#1a1a1a;color:#fff}.frame-nav-back{color:#ccc;border-color:#333}.frame-content{flex:1;width:100%;border:none;background:#000}@media(max-width:420px){.calculator{border-radius:0;max-width:100%;padding:1rem}.calc-btn{padding:.7rem 0;font-size:1rem}.display-result{font-size:1.8rem}}@media(max-height:600px)and (orientation:landscape){.calculator.scientific{max-width:100%;border-radius:10px;padding:.6rem .8rem}.calculator.scientific .display{min-height:56px;padding:.5rem .8rem;margin-bottom:.5rem}.calculator.scientific .display-result{font-size:1.5rem}.calculator.scientific .display-expression{font-size:.8rem}.calculator.scientific .btn-grid{gap:4px}.calculator.scientific .calc-btn{padding:.4rem .05rem;font-size:.82rem;border-radius:6px}.calculator.scientific .calc-btn.scientific{font-size:.7rem}.calculator.scientific .calc-btn.operator,.calculator.scientific .calc-btn.equals{font-size:.9rem}.calculator.scientific .skin-bar{margin-bottom:.3rem}.calculator.scientific .skin-btn{width:20px;height:20px}.calculator.scientific .mode-toggle{margin-bottom:.3rem}}
