#ptt-root { --blue:#1A6FB5; --blue-lt:#EAF3FB; --teal:#1F8A70; --teal-lt:#E6F5F1;
	--warm:#B5651A; --warm-lt:#FBF0E6; --danger:#B5341A; --danger-lt:#FBEAE6;
	--slate:#334155; --muted:#64748B; --border:#E2E8F0; --white:#fff; --r:10px;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; color:var(--slate); font-size:15px;
	width:100%; max-width:100%; box-sizing:border-box; }
#ptt-root * { box-sizing:border-box; }
#ptt-root .ptt-topbar { display:flex; justify-content:flex-end; align-items:center; gap:.8rem; padding:.5rem 1rem; border-bottom:1px solid var(--border); font-size:.85rem; color:var(--muted); }
#ptt-root .ptt-btn-small { padding:.35rem .8rem; font-size:.8rem; }
#ptt-root .ptt-layout { display:flex; gap:0; width:100%; margin:0 auto; }
#ptt-root .ptt-nav { width:250px; flex-shrink:0; border-right:1px solid var(--border); padding:1rem 0; }
#ptt-root .ptt-nav-sec { font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); padding:.9rem 1rem .3rem; }
#ptt-root .ptt-nav-item { display:flex; align-items:center; gap:.5rem; padding:.42rem 1rem; cursor:pointer; font-size:.79rem; border-left:3px solid transparent; }
#ptt-root .ptt-nav-item:hover { background:var(--blue-lt); }
#ptt-root .ptt-nav-item.active { border-left-color:var(--blue); background:var(--blue-lt); color:var(--blue); font-weight:700; }
#ptt-root .ptt-nav-item.locked { cursor:not-allowed; color:var(--border); opacity:.65; }
#ptt-root .ptt-nav-item.locked:hover { background:none; }
#ptt-root .ptt-nav-dot { width:19px; height:19px; border-radius:50%; flex-shrink:0; background:var(--border); display:flex; align-items:center; justify-content:center; font-size:.57rem; font-weight:700; }
#ptt-root .ptt-nav-dot.done { background:var(--teal); color:#fff; }
#ptt-root .ptt-main { flex:1; min-width:0; padding:1.75rem 3rem; max-width:1000px; }
#ptt-root .ptt-card { background:var(--white); border:1px solid var(--border); border-radius:var(--r); padding:1.25rem 1.5rem; margin-bottom:1.2rem; }
#ptt-root .ptt-eyebrow { font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:var(--teal); margin-bottom:.35rem; }
#ptt-root .ptt-title { font-size:1.4rem; font-weight:800; margin-bottom:.3rem; }
#ptt-root .ptt-goal { color:var(--muted); font-style:italic; font-size:.92rem; }
#ptt-root h2 { font-size:1.08rem; font-weight:700; color:var(--slate); margin:1rem 0 .6rem; }
#ptt-root .ptt-callout { border-radius:8px; padding:.85rem 1rem; margin:.85rem 0; font-size:.9rem; }
#ptt-root .ptt-callout.info { background:var(--blue-lt); border-left:4px solid var(--blue); }
#ptt-root .ptt-callout.warn { background:var(--warm-lt); border-left:4px solid var(--warm); }
#ptt-root .ptt-callout.safe { background:var(--danger-lt); border-left:4px solid var(--danger); }
#ptt-root .ptt-callout.teal { background:var(--teal-lt); border-left:4px solid var(--teal); }
#ptt-root .ptt-video-slot { background:var(--slate); border-radius:var(--r); padding:1.75rem; text-align:center; color:rgba(255,255,255,.7); margin-bottom:1.2rem; border:2px dashed rgba(255,255,255,.15); }
#ptt-root .ptt-video-slot strong { color:#fff; display:block; font-size:.9rem; margin-bottom:.2rem; }
#ptt-root .ptt-video-icon { font-size:2.2rem; margin-bottom:.45rem; }
#ptt-root .ptt-doc-slot { background:var(--slate); border-radius:var(--r); padding:1.5rem; text-align:center; color:rgba(255,255,255,.7); border:2px dashed rgba(255,255,255,.15); }
#ptt-root .ptt-doc-slot strong { color:#fff; display:block; margin-bottom:.2rem; }
#ptt-root .ptt-doc-icon { font-size:2rem; margin-bottom:.45rem; }
#ptt-root .ptt-gl-grid { display:grid; grid-template-columns:1fr 1fr; gap:.85rem; margin:.85rem 0; }
#ptt-root .ptt-gl-box { border-radius:8px; padding:1rem; }
#ptt-root .ptt-gl-box h4 { margin:0 0 .5rem; font-size:.82rem; text-transform:uppercase; letter-spacing:.05em; color:var(--slate); }
#ptt-root .ptt-gl-box ul { margin:0; padding-left:1.1rem; font-size:.87rem; }
#ptt-root .ptt-gl-box li { margin-bottom:.3rem; }
#ptt-root .ptt-gl-box.loss { background:var(--danger-lt); border-left:4px solid var(--danger); }
#ptt-root .ptt-gl-box.loss h4 { color:var(--danger); }
#ptt-root .ptt-gl-box.gain { background:var(--teal-lt); border-left:4px solid var(--teal); }
#ptt-root .ptt-gl-box.gain h4 { color:var(--teal); }
#ptt-root .ptt-ws-card, #ptt-root .ptt-ws-q { border:1px solid var(--border); border-radius:var(--r); padding:1rem 1.2rem; margin-bottom:.9rem; }
#ptt-root .ptt-ws-opts { display:flex; flex-direction:column; gap:.4rem; margin-top:.5rem; }
#ptt-root .ptt-ws-opt { border:1px solid var(--border); border-radius:6px; padding:.55rem .8rem; cursor:pointer; font-size:.88rem; }
#ptt-root .ptt-ws-opt:hover { border-color:var(--blue); }
#ptt-root .ptt-ws-opt.correct { border-color:var(--teal); background:var(--teal-lt); font-weight:700; }
#ptt-root .ptt-ws-opt.wrong { border-color:var(--danger); background:var(--danger-lt); }
#ptt-root .ptt-ws-opt.disabled { opacity:.5; cursor:default; }
#ptt-root .ptt-ws-fb { margin-top:.6rem; font-size:.85rem; color:var(--muted); }
#ptt-root .ptt-fg { margin-bottom:.9rem; }
#ptt-root .ptt-ws-label { display:block; font-size:.88rem; font-weight:600; margin-bottom:.4rem; }
#ptt-root textarea, #ptt-root input[type=text], #ptt-root input[type=email], #ptt-root input[type=password] {
	width:100%; border:1px solid var(--border); border-radius:6px; padding:.55rem .7rem; font-size:.9rem; font-family:inherit; }
#ptt-root .ptt-r-row { display:flex; gap:.4rem; margin-top:.4rem; }
#ptt-root .ptt-r-btn { border:1px solid var(--border); border-radius:6px; padding:.4rem .8rem; background:#fff; cursor:pointer; }
#ptt-root .ptt-r-btn.selected { background:var(--blue); color:#fff; border-color:var(--blue); }
#ptt-root .ptt-r-labels { display:flex; justify-content:space-between; font-size:.75rem; color:var(--muted); margin-top:.3rem; }
#ptt-root .ptt-btn { border-radius:8px; padding:.65rem 1.3rem; font-size:.9rem; font-weight:700; cursor:pointer; border:1px solid var(--border); background:#fff; }
#ptt-root .ptt-btn-primary { background:var(--blue); color:#fff; border-color:var(--blue); }
#ptt-root .ptt-btn-secondary { background:#fff; color:var(--blue); border-color:var(--blue); }
#ptt-root .ptt-btn-row { display:flex; justify-content:space-between; margin-top:1rem; }
#ptt-root .ptt-hero { text-align:center; }
#ptt-root .ptt-hero-court { font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:var(--blue); }
#ptt-root .ptt-hero h1 { font-size:1.8rem; margin:.4rem 0; }
#ptt-root .ptt-hero-sub { color:var(--muted); max-width:520px; margin:0 auto; }
#ptt-root .ptt-deadline { margin-top:1rem; background:var(--blue-lt); border-radius:8px; padding:.7rem 1rem; font-size:.85rem; }
#ptt-root .ptt-notice { padding:.8rem 1rem; border-radius:8px; font-size:.9rem; }
#ptt-root .ptt-notice.good { background:var(--teal-lt); color:var(--teal); }
#ptt-root .ptt-notice.bad { background:var(--danger-lt); color:var(--danger); }
#ptt-root .ptt-faq-wrap { margin-top:1rem; text-align:left; }
#ptt-root .ptt-faq-heading { font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:var(--blue); margin-bottom:.6rem; text-align:center; }
#ptt-root .ptt-faq-item { border-bottom:1px solid var(--border); }
#ptt-root .ptt-faq-q { width:100%; text-align:left; background:none; border:none; padding:.7rem .2rem; font-size:.9rem; font-weight:600; cursor:pointer; color:var(--slate); display:flex; justify-content:space-between; }
#ptt-root .ptt-faq-a { padding:.2rem .2rem .8rem; font-size:.86rem; color:var(--muted); }
#ptt-root .ptt-needhelp { margin-top:1rem; background:var(--white); border:1px solid var(--border); border-radius:var(--r); padding:.75rem 1.1rem; font-size:.86rem; }
#ptt-root .ptt-needhelp a { color:var(--blue); font-weight:700; text-decoration:none; }
#ptt-root .ptt-stages { list-style:none; padding:0; margin:.85rem 0; }
#ptt-root .ptt-stage { display:flex; gap:.8rem; align-items:flex-start; padding:.65rem 0; border-bottom:1px solid var(--border); }
#ptt-root .ptt-stage:last-child { border-bottom:none; }
#ptt-root .ptt-st-icon { width:26px; height:26px; border-radius:50%; background:var(--blue-lt); color:var(--blue); font-weight:800; font-size:.72rem; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:.15rem; }
#ptt-root .ptt-stage strong { display:block; font-size:.92rem; }
#ptt-root .ptt-stage em { display:block; font-size:.85rem; color:var(--muted); margin-top:.15rem; }
#ptt-root .ptt-compare-grid { display:grid; grid-template-columns:1fr 1fr; gap:.85rem; margin:.85rem 0; }
#ptt-root .ptt-cg-col { border:1px solid var(--border); border-radius:8px; padding:1rem; }
#ptt-root .ptt-cg-col h4 { margin:0 0 .5rem; font-size:.82rem; text-transform:uppercase; letter-spacing:.05em; color:var(--slate); }
#ptt-root .ptt-cg-col.r { background:var(--blue-lt); }
#ptt-root .ptt-cg-col.good { background:var(--teal-lt); border-left:4px solid var(--teal); }
#ptt-root .ptt-cg-col.good h4 { color:var(--teal); }
#ptt-root .ptt-cg-col.bad { background:var(--danger-lt); border-left:4px solid var(--danger); }
#ptt-root .ptt-cg-col.bad h4 { color:var(--danger); }
#ptt-root .ptt-cg-col ul { margin:0; padding-left:1.1rem; font-size:.87rem; }
#ptt-root .ptt-cg-col li { margin-bottom:.3rem; }
#ptt-root .ptt-dating-list { list-style:none; padding:0; margin:.85rem 0; }
#ptt-root .ptt-d-item { display:flex; gap:.8rem; align-items:flex-start; padding:.6rem 0; border-bottom:1px solid var(--border); }
#ptt-root .ptt-d-item:last-child { border-bottom:none; }
#ptt-root .ptt-d-num { width:24px; height:24px; border-radius:50%; background:var(--blue-lt); color:var(--blue); font-weight:800; font-size:.72rem; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:.1rem; }
#ptt-root .ptt-d-item p { margin:0; font-size:.9rem; }
#ptt-root .ptt-fb-good { color:var(--teal); }
#ptt-root .ptt-fb-bad { color:var(--danger); }
@media (max-width:640px){ #ptt-root .ptt-compare-grid, #ptt-root .ptt-gl-grid { grid-template-columns:1fr; } }
#ptt-root .ptt-error { color:var(--danger); font-size:.85rem; min-height:1.2em; }
#ptt-root .ptt-auth { max-width:420px; margin:2rem auto; }
#ptt-root .ptt-tabs { display:flex; gap:.5rem; margin-bottom:1rem; }
#ptt-root .ptt-tab { flex:1; padding:.6rem; border:1px solid var(--border); background:#fff; cursor:pointer; border-radius:8px; font-weight:700; }
#ptt-root .ptt-tab.active { background:var(--blue); color:#fff; border-color:var(--blue); }
#ptt-root form label { display:block; margin-bottom:.8rem; font-size:.85rem; font-weight:600; }
@media (max-width:700px){ #ptt-root .ptt-layout{ flex-direction:column; } #ptt-root .ptt-nav{ width:100%; border-right:none; border-bottom:1px solid var(--border); } }