:root{--pug-primary:#4C1CFB;--pug-hover:#000000;--pug-ink:#171722;--pug-muted:#71727f;--pug-line:#e8e7ef;--pug-bg:#f8f8fc}
.pug-app{max-width:1160px;margin:0 auto;padding:42px 20px 90px;color:var(--pug-ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.pug-app *,.pug-app *:before,.pug-app *:after{box-sizing:border-box}
.pug-hero{text-align:center;max-width:820px;margin:0 auto 34px}
.pug-eyebrow,.pug-label{color:var(--pug-primary);font-size:11px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
.pug-hero h1{font-size:clamp(40px,6vw,68px);line-height:1;letter-spacing:-.055em;margin:11px 0 16px}
.pug-hero p{margin:0;color:var(--pug-muted);font-size:17px;line-height:1.7}
.pug-card{border:1px solid var(--pug-line);background:#fff;border-radius:28px;padding:27px;box-shadow:0 25px 75px rgba(25,22,62,.1)}
.pug-card-head{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:20px}
.pug-card-head h2{margin:7px 0 0;font-size:25px;letter-spacing:-.03em}
.pug-local{padding:8px 11px;border:1px solid #e4e0ff;background:#f8f6ff;color:var(--pug-primary);border-radius:999px;font-size:12px;font-weight:800;white-space:nowrap}
.pug-main-result{padding:18px;border:1px solid var(--pug-line);border-radius:19px;background:#fbfbfd}
.pug-result-label{display:block;color:var(--pug-muted);font-size:12px;font-weight:800;margin-bottom:10px}
.pug-results{display:grid;gap:8px}
.pug-result-row{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:12px;padding:12px 13px;border:1px solid #e9e8ee;border-radius:12px;background:#fff}
.pug-result-number{color:#999aa7;font-size:11px;font-weight:900}
.pug-username{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:16px;letter-spacing:.01em;word-break:break-all}
.pug-copy{border:1px solid var(--pug-line);background:#fff;border-radius:9px;padding:8px 11px;font-size:12px;font-weight:800;cursor:pointer;transition:.18s}
.pug-copy:hover,.pug-copy.copied{border-color:var(--pug-primary);color:var(--pug-primary)}
.pug-result-actions{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:13px}
.pug-btn{min-height:52px;border:0;border-radius:13px;padding:13px 20px;font-weight:850;cursor:pointer;transition:transform .18s,background .18s,box-shadow .18s}
.pug-primary{background:var(--pug-primary);color:#fff;box-shadow:0 10px 24px rgba(76,28,251,.19)}
.pug-primary:hover{background:#000;color:#fff;transform:translateY(-2px)}
.pug-secondary{background:#f0f0f5;color:var(--pug-ink)}
.pug-secondary:hover{background:var(--pug-hover);color:#fff;transform:translateY(-2px)}
.pug-disclaimer,.pug-privacy{color:#777884;font-size:12px;line-height:1.6;text-align:center;margin:12px 0 0}
.pug-message{min-height:19px;text-align:center;font-size:13px;margin-top:8px}
.pug-error{color:#c62828}.pug-note{color:#6a5d00}
.pug-controls{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-top:14px}
.pug-panel{padding:18px;border:1px solid var(--pug-line);border-radius:17px;background:#fff}
.pug-panel label,.pug-panel legend{font-size:13px;font-weight:850}
.pug-panel>label{display:block;margin-bottom:9px}
.pug-panel input[type=text],.pug-panel select{width:100%;height:44px;border:1px solid #dddce5;border-radius:10px;background:#fff;padding:0 12px;color:var(--pug-ink);font:inherit}
.pug-panel input:focus,.pug-panel select:focus{border-color:var(--pug-primary);outline:3px solid rgba(76,28,251,.12)}
.pug-panel small{display:block;color:var(--pug-muted);font-size:11px;margin-top:7px;line-height:1.5}
.pug-heading{display:flex;justify-content:space-between;gap:12px}.pug-heading output{color:var(--pug-primary);font-weight:900;font-size:17px}
#pug-length{width:100%;margin:20px 0 7px;accent-color:var(--pug-primary);cursor:pointer}
.pug-range{display:flex;justify-content:space-between;color:#999aa5;font-size:11px}
.pug-options{grid-column:span 2}
.pug-options fieldset{border:0;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:11px}
.pug-options legend{margin-bottom:10px}
.pug-options label{display:flex;align-items:center;gap:8px;font-weight:700;cursor:pointer}
.pug-options input{width:17px;height:17px;accent-color:var(--pug-primary)}
.pug-content{padding-top:65px}.pug-section{padding:58px 0}
.pug-section h2{font-size:clamp(30px,4.5vw,46px);line-height:1.05;letter-spacing:-.045em;margin:8px 0 12px}
.pug-section>p{max-width:780px;color:var(--pug-muted);line-height:1.75}
.pug-benefits,.pug-topic-grid,.pug-steps{display:grid;gap:13px;margin-top:26px}
.pug-benefits{grid-template-columns:repeat(4,1fr)}.pug-topic-grid{grid-template-columns:repeat(4,1fr)}.pug-steps{grid-template-columns:repeat(3,1fr)}
.pug-benefits article,.pug-topic-grid>div,.pug-steps>div{padding:23px;border:1px solid var(--pug-line);border-radius:18px;background:#fff}
.pug-benefits b,.pug-steps b{color:var(--pug-primary);font-size:12px}.pug-benefits h3,.pug-topic-grid h3,.pug-steps h3{font-size:16px;margin:18px 0 7px}.pug-benefits p,.pug-topic-grid p,.pug-steps p{margin:0;color:var(--pug-muted);font-size:13px;line-height:1.65}
.pug-tips{display:grid;grid-template-columns:.8fr 1.2fr;gap:45px;padding:48px;border-radius:24px;background:#f7f6fc}
.pug-tips ul{margin:0;padding:0;list-style:none}.pug-tips li{position:relative;padding:0 0 14px 25px;color:#555665;line-height:1.6}.pug-tips li:before{content:"✓";position:absolute;left:0;color:var(--pug-primary);font-weight:900}
.pug-faq details{border-top:1px solid var(--pug-line);padding:20px 0}.pug-faq summary{cursor:pointer;font-weight:850}.pug-faq details p{max-width:800px;color:var(--pug-muted);line-height:1.7}
@media(max-width:950px){.pug-controls{grid-template-columns:1fr 1fr}.pug-options{grid-column:auto}.pug-benefits,.pug-topic-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.pug-app{padding:28px 13px 65px}.pug-card{padding:17px;border-radius:22px}.pug-card-head{align-items:flex-start;flex-direction:column}.pug-controls,.pug-benefits,.pug-topic-grid,.pug-steps,.pug-tips{grid-template-columns:1fr}.pug-tips{padding:27px;gap:15px}}
@media(max-width:480px){.pug-result-actions{grid-template-columns:1fr}.pug-options fieldset{grid-template-columns:1fr}.pug-btn{width:100%}.pug-result-row{grid-template-columns:31px 1fr auto}.pug-hero h1{font-size:39px}}