:root{--xp-line:rgba(25,60,46,.15)}
.app-shell{width:min(1280px,100%)}
.xp-screen{width:min(1060px,100%)}
.brand img{width:50px;height:50px;border-radius:12px}
.brand small{font-size:9px;letter-spacing:.07em}
.xp-icon-button{display:grid;place-items:center;position:relative;width:40px;height:40px;border:1px solid #ffffff30;border-radius:50%;background:transparent;color:var(--cream);cursor:pointer}
.xp-icon-button svg{width:21px;height:21px}
.xp-icon-button span:not(:empty){position:absolute;right:-3px;top:-2px;display:grid;place-items:center;min-width:16px;height:16px;border-radius:20px;background:var(--gold);color:var(--deep);font-size:9px;font-weight:800}
.xp-review-bar{position:sticky;top:76px;z-index:19;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px clamp(16px,4vw,36px);border-bottom:1px solid #d8cfb7;background:#f0e6c8;font-size:10px;color:var(--earth)}
.xp-review-bar>span{font-weight:750}
.xp-review-bar>div{display:flex;gap:8px}
.xp-review-bar button{min-height:32px;padding:6px 9px;border:1px solid #9b906750;border-radius:9px;color:var(--deep);background:var(--paper);font-size:10px;font-weight:750;cursor:pointer}
.xp-review-bar button:last-child{background:var(--deep);color:var(--cream)}
.bottom-nav svg{height:21px;width:21px}
.bottom-nav button{gap:5px;padding:10px 0;min-height:64px}
.bottom-nav button>span{font-size:10px}
button:disabled{cursor:not-allowed;opacity:.45;transform:none!important}
.xp-welcome{position:relative;display:flex;flex-direction:column;justify-content:center;overflow:hidden;min-height:660px;padding:42px;border-radius:24px;color:var(--cream);background:radial-gradient(ellipse at 95% 80%,#71854d70,transparent 55%),var(--deep)}
.xp-welcome>img{width:86px;height:86px;border-radius:18px;margin-bottom:34px}
.xp-welcome h1{color:var(--cream);font-size:clamp(52px,6vw,78px)}
.xp-welcome p{position:relative;z-index:2;max-width:290px;line-height:1.6;color:#f8f1debd}
.xp-welcome .eyebrow{color:var(--gold)}
.xp-orbits{position:absolute;right:-90px;bottom:-90px;width:380px;height:380px;border:1px solid #e7c44b40;border-radius:50%;display:grid;place-items:center}
.xp-orbits:before{content:'';position:absolute;inset:35px;border:1px solid #e7c44b30;border-radius:50%}
.xp-orbits svg{width:180px;height:180px;color:#e7c44b50;transform:rotate(-18deg)}
.xp-greeting{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}
.xp-greeting p:not(.eyebrow){margin:0;color:var(--deep);font-size:23px;font-weight:700}
.xp-avatar{display:grid;place-items:center;flex-shrink:0;width:72px;height:72px;border-radius:50%;border:3px solid var(--gold);background:var(--deep);color:var(--cream);font-size:23px;font-weight:800;object-fit:cover}
.xp-avatar-button{padding:0;border:0;background:none;border-radius:50%;cursor:pointer}
.xp-avatar-button .xp-avatar{width:52px;height:52px;font-size:17px}
.xp-tree{display:grid;place-items:center;position:relative;min-height:220px;border-radius:50%;border:1px solid #e7c44b33;background:radial-gradient(circle,#e7c44b1a,transparent 65%)}
.xp-tree:before{content:'';position:absolute;inset:20px;border:1px solid #e7c44b33;border-radius:50%}
.xp-tree svg{width:125px;height:125px;color:var(--gold);stroke-width:.8}
.stats{grid-template-columns:repeat(3,minmax(0,1fr))}
.xp-stats-four{grid-template-columns:repeat(4,minmax(0,1fr))}
.xp-scope-label{display:flex;justify-content:space-between;gap:18px;align-items:baseline;margin:26px 0 10px;color:var(--deep)}
.xp-scope-label strong{font-size:15px}.xp-scope-label span{max-width:520px;color:var(--muted);font-size:11px;line-height:1.5;text-align:right}
.xp-section-title{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:30px 0 15px}
.xp-section-title h2{font-size:28px;margin:0}
.xp-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}
.xp-link-card{display:flex;align-items:center;gap:15px;min-width:0;min-height:110px;padding:20px;border:1px solid var(--xp-line);border-radius:18px;background:var(--paper);color:var(--deep);text-align:left;cursor:pointer;transition:transform .15s,box-shadow .15s}
.xp-link-card:hover{transform:translateY(-2px);box-shadow:0 8px 25px #193c2e10}
.xp-link-card>span:nth-child(2){flex:1;min-width:0}
.xp-link-card strong,.xp-link-card small{display:block}
.xp-link-card strong{font-size:17px}
.xp-link-card small{margin-top:6px;color:var(--muted);font-size:12px;line-height:1.4}
.xp-link-card>svg{width:18px;height:18px;flex-shrink:0}
.xp-link-symbol{position:relative;display:grid;place-items:center;flex-shrink:0;width:50px;height:50px;border:1px solid #b99d3f80;border-radius:15px;color:var(--deep);background:radial-gradient(circle at 50% 34%,#f5e7ac,#d6c36f 62%,#61764c);box-shadow:inset 0 0 0 3px #fff8dc80,0 8px 18px #193c2e18}
.xp-link-symbol::after{content:"";position:absolute;right:5px;bottom:5px;width:6px;height:6px;border:1px solid #fff4c7;border-radius:50%;background:var(--forest);box-shadow:0 0 0 2px #d9ff5745}
.xp-link-symbol svg{width:27px;height:27px;stroke-width:1.6;filter:drop-shadow(0 1px 0 #fff8d5)}
.xp-section{margin-top:24px}
.xp-section p{color:var(--muted);line-height:1.65;font-size:14px}
.xp-section h2{font-size:30px}
.xp-check{display:flex;align-items:flex-start;gap:10px;line-height:1.5;font-size:13px;font-weight:600;padding:12px 0}
.xp-check input{width:20px;height:20px;min-height:20px;flex-shrink:0;margin:0;accent-color:var(--forest)}
.xp-filters{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}
.xp-filters button{padding:9px 15px;min-height:38px;border:1px solid var(--xp-line);border-radius:22px;background:var(--paper);color:var(--forest);cursor:pointer;font-size:12px;font-weight:700}
.xp-filters button[aria-pressed=true]{background:var(--deep);color:var(--cream);border-color:var(--deep)}
.xp-garden .xp-garden-art{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:135px;overflow:hidden;background:linear-gradient(130deg,var(--deep),#456346);color:var(--gold);padding:25px}
.xp-garden-art svg{width:58px;height:58px;stroke-width:1.2}
.xp-garden-art .xp-garden-state{position:relative;z-index:2;flex-shrink:0;padding:7px 10px;background:#ffffff10;border:1px solid #ffffff20;border-radius:25px;font-size:10px;color:var(--cream)}
.xp-garden-art--course{isolation:isolate;background:radial-gradient(circle at 22% 18%,#8ca86155,transparent 32%),linear-gradient(118deg,#102f25 0%,#294d36 48%,#526b43 100%)}
.xp-garden-art--course::before,.xp-garden-art--course::after{content:"";position:absolute;z-index:-1;border:1px solid #e7c44b26;border-radius:50%;pointer-events:none}
.xp-garden-art--course::before{right:17%;width:190px;height:190px}
.xp-garden-art--course::after{right:calc(17% + 35px);width:118px;height:118px}
.xp-garden-brand{display:grid;place-items:center;flex:0 0 76px;width:76px;height:76px;overflow:hidden;border:1px solid #e7c44b80;border-radius:22px;background:var(--cream);box-shadow:0 12px 28px #071c1640,inset 0 0 0 3px #fff8dc}
.xp-garden-brand img{display:block;width:100%;height:100%;object-fit:cover}
.xp-garden-course{position:relative;z-index:2;flex:1;min-width:0}
.xp-garden-course small,.xp-garden-course strong{display:block}
.xp-garden-course small{margin-bottom:5px;color:#e7c44bcc;font-size:9px;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
.xp-garden-course strong{color:var(--cream);font-family:"Arial Narrow","DIN Condensed",sans-serif;font-size:clamp(21px,3vw,31px);line-height:1.02;letter-spacing:-.025em;text-wrap:balance}
.xp-garden h2{font-size:31px;overflow-wrap:anywhere}
.xp-garden-summary{display:grid;gap:18px;padding:24px!important;background:linear-gradient(180deg,#fffdf8,#fbf8ee)}
.xp-garden-summary-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:start}
.xp-garden-summary-head .eyebrow{margin-bottom:7px}.xp-garden-summary-head h2{margin:0;line-height:.98}
.xp-garden-score{display:grid;grid-template-columns:auto auto;align-items:baseline;min-width:116px;padding:11px 13px;border:1px solid #b99d3f55;border-radius:16px;background:linear-gradient(145deg,#f8edc6,#edf0dc);color:var(--deep);text-align:right}
.xp-garden-score small{grid-column:1/-1;color:var(--forest);font-size:8px;font-weight:850;letter-spacing:.09em;text-transform:uppercase}
.xp-garden-score strong{margin-top:4px;color:var(--deep);font-size:30px;line-height:1}
.xp-garden-score span{margin-left:4px;color:var(--muted);font-size:8px;line-height:1.25}
.xp-garden-course-progress{display:grid;grid-template-columns:1fr auto;gap:7px 14px;align-items:end;padding-top:16px;border-top:1px solid var(--xp-line)}
.xp-garden-course-progress>div{display:flex;justify-content:space-between;gap:12px;grid-column:1/-1;color:var(--deep);font-size:11px}.xp-garden-course-progress>div span{color:var(--muted)}
.xp-garden-course-progress progress{grid-column:1;width:100%;height:9px;overflow:hidden;appearance:none;border:0;border-radius:20px;background:#dfe5d5}
.xp-garden-course-progress progress::-webkit-progress-bar{border-radius:20px;background:#dfe5d5}.xp-garden-course-progress progress::-webkit-progress-value{border-radius:20px;background:linear-gradient(90deg,var(--gold),var(--lime))}.xp-garden-course-progress progress::-moz-progress-bar{border-radius:20px;background:linear-gradient(90deg,var(--gold),var(--lime))}
.xp-garden-course-progress>small{grid-column:2;color:var(--muted);font-size:8px;white-space:nowrap}
.xp-garden-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.xp-garden-metrics>div{min-width:0;padding:12px;border:1px solid #193c2e12;border-radius:14px;background:#eef1e4}
.xp-garden-metrics small,.xp-garden-metrics strong{display:block}.xp-garden-metrics small{min-height:24px;color:var(--muted);font-size:8px;font-weight:750;line-height:1.35;text-transform:uppercase}.xp-garden-metrics strong{margin-top:4px;color:var(--deep);font-size:16px;line-height:1.1}.xp-garden-metrics strong span{color:var(--muted);font-size:9px;font-weight:650}
.xp-garden-summary-foot{display:flex;justify-content:space-between;align-items:center;gap:14px}.xp-garden-summary-foot>span{color:var(--muted);font-size:10px}.xp-garden-summary-foot .primary{flex-shrink:0}
.xp-equipment-intro{display:flex;align-items:center;gap:16px;padding:16px;border:1px solid var(--xp-line);border-radius:16px;background:#edf0e1}
.xp-equipment-intro>svg{flex:0 0 44px;width:44px;height:44px;color:var(--forest)}
.xp-equipment-intro strong,.xp-equipment-intro span{display:block}.xp-equipment-intro span{margin-top:4px;color:var(--muted);font-size:11px;line-height:1.45}
.xp-records{display:grid;gap:15px;margin-top:20px}
.xp-notification-card{display:grid;grid-template-columns:54px minmax(0,1fr);gap:18px;align-items:start}
.xp-notification-card.is-new{border-left:4px solid var(--gold)}
.xp-notification-icon{display:grid;place-items:center;width:54px;height:54px;border-radius:16px;color:var(--deep);background:#e9edda}
.xp-notification-icon svg{width:30px;height:30px}.xp-notification-card h3{margin-bottom:6px}.xp-notification-card .quiet{margin-top:10px}
.xp-record-meta{display:flex;justify-content:space-between;gap:8px;color:var(--forest);font-size:10px;text-transform:uppercase;letter-spacing:.06em;margin-bottom:12px}
.xp-record p,.xp-records .card p{white-space:pre-wrap;overflow-wrap:anywhere;color:var(--muted);font-size:14px;line-height:1.6}
.xp-photo-button{display:block;padding:0;border:0;background:none;cursor:zoom-in;margin-bottom:16px}
.xp-photo-button img{display:block;max-height:340px;width:100%;object-fit:contain;border-radius:12px}
.xp-photo-full{max-width:100%;max-height:70vh;object-fit:contain}
.xp-level-card,.xp-profile-card{display:flex;align-items:center;gap:24px;padding:32px;background:var(--deep);color:var(--cream);border-radius:22px;margin:20px 0}
.xp-level-card>div,.xp-profile-card>div{flex:1;min-width:0}
.xp-level-card .xp-avatar,.xp-profile-card .xp-avatar{width:104px;height:104px;font-size:32px}
.xp-level-card h2,.xp-profile-card h2{color:var(--cream);overflow-wrap:anywhere}
.xp-level-card .eyebrow,.xp-profile-card .eyebrow{color:var(--gold)}
.xp-level-card p,.xp-profile-card p{color:#f8f1deb8;font-size:13px}
.xp-level-card progress{appearance:none;display:block;width:100%;height:7px;margin:15px 0 8px;accent-color:var(--gold)}
.xp-level-card progress::-webkit-progress-bar{background:#ffffff20;border-radius:10px}.xp-level-card progress::-webkit-progress-value{background:var(--gold);border-radius:10px}
.xp-level-card small{color:#f8f1dea0;font-size:10px}
.xp-garden-progress{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:14px 0 24px;padding:18px 22px;border:1px solid var(--xp-line);border-radius:18px;background:#eef0e2;color:var(--deep)}
.xp-garden-progress>div{display:flex;align-items:center;gap:13px;min-width:0}.xp-garden-progress svg{width:36px;height:36px;flex:0 0 36px}.xp-garden-progress span>*{display:block}.xp-garden-progress span small{color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.08em}.xp-garden-progress span strong{margin-top:3px;overflow-wrap:anywhere}.xp-garden-progress>strong{font-size:24px;white-space:nowrap}.xp-garden-progress>strong small{font-size:10px}
.xp-purchase-card{display:grid;grid-template-columns:1fr 1fr;gap:28px;background:var(--deep);color:var(--cream);padding:30px;border-radius:24px}
.xp-purchase-card>div:first-child{padding:15px}
.xp-purchase-card>div:first-child h2{color:var(--cream);font-size:46px}
.xp-purchase-card>div:first-child .eyebrow{color:var(--gold)}
.xp-purchase-card ul{padding-left:20px;line-height:2;font-size:14px}
.xp-purchase-card .card{color:var(--ink)}
.xp-purchase-card .card h2{font-size:38px}.xp-purchase-card .card p{font-size:13px;line-height:1.65}
.xp-review-note{padding:23px;border-radius:18px;border:1px solid #b7953030;background:#f1e5be;color:var(--earth);font-size:15px;line-height:1.6}
.xp-review-note p{margin:8px 0 0;font-size:13px}
.xp-rhythm-rule{display:flex;align-items:center;gap:12px;margin:14px 0 20px;padding:14px 16px;border:1px solid #b7953040;border-radius:14px;background:#f1e5be;color:var(--earth)}
.xp-rhythm-rule strong{white-space:nowrap}
.xp-rhythm-rule span{font-size:12px;line-height:1.45}
input[type=file]{padding:10px;font-size:11px}
dialog{width:min(600px,calc(100% - 28px));max-height:calc(100dvh - 48px);overflow:auto;border:1px solid #193c2e30;border-radius:24px;padding:0;background:var(--paper);color:var(--ink);box-shadow:0 35px 100px #0a211c50}
dialog::backdrop{background:#071c16bd;backdrop-filter:blur(6px)}
.xp-modal{position:relative;padding:36px;overflow:hidden}
.xp-modal-close{position:absolute;z-index:5;right:14px;top:12px;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#e8ecdf;border:0;cursor:pointer;color:var(--deep);font-size:26px}
.xp-modal h2{font-size:37px;line-height:1.1}
.xp-modal p{line-height:1.6;color:var(--muted)}
.xp-tutorial{display:grid;gap:18px}
.xp-tutorial h2,.xp-tutorial p{margin:0}
.xp-tutorial p{font-size:15px;line-height:1.7}
.xp-tutorial-mark{display:grid;place-items:center;width:86px;height:86px;overflow:hidden;border:1px solid #e7c44b80;border-radius:24px;background:var(--cream);box-shadow:0 14px 32px #193c2e22,inset 0 0 0 4px #fff9e5}
.xp-tutorial-mark img{display:block;width:100%;height:100%;object-fit:cover}
.xp-tutorial-visual{display:grid;place-items:center;width:92px;height:92px;border:1px solid #e7c44b80;border-radius:28px;color:var(--gold);background:radial-gradient(circle at 50% 30%,#536e48,#193c2e 70%);box-shadow:0 18px 38px #193c2e2d}
.xp-tutorial-visual svg{width:50px;height:50px;stroke-width:1.35}
.xp-tutorial-progress{display:flex;align-items:center;justify-content:space-between;gap:16px;color:var(--forest);font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.xp-tutorial-progress>div{display:flex;gap:6px}
.xp-tutorial-progress>div span{width:7px;height:7px;border-radius:50%;background:#193c2e24}
.xp-tutorial-progress>div span[aria-current=step]{width:22px;border-radius:99px;background:var(--gold)}
.xp-tutorial-actions{display:flex;justify-content:space-between;gap:10px;margin-top:4px}
.xp-tutorial-actions button{min-width:132px}
.xp-tutorial-actions .primary{margin-left:auto}
.xp-achievement-detail{text-align:center}.xp-achievement-detail>img{display:block;margin:16px auto 24px;width:200px;height:200px;object-fit:contain;border-radius:22px}.xp-achievement-detail .primary{width:100%}
.xp-celebration{position:relative;isolation:isolate;text-align:center;padding:20px 0 5px;animation:xp-emerge .6s cubic-bezier(.2,.8,.3,1) both}
.xp-celebration>img{position:relative;display:block;width:210px;height:210px;object-fit:contain;border-radius:24px;margin:0 auto 25px;animation:xp-reveal .8s .05s both}
.xp-celebration .eyebrow{position:relative;color:var(--forest)}
.xp-rays{position:absolute;z-index:-1;top:-55px;left:50%;width:420px;height:420px;transform:translateX(-50%);border-radius:50%;background:repeating-conic-gradient(from 20deg,#e7c44b20 0deg 5deg,transparent 5deg 30deg);mask-image:radial-gradient(circle,#000 15%,transparent 70%);animation:xp-halo 1.4s ease both}
@keyframes xp-emerge{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
@keyframes xp-reveal{from{opacity:0;transform:scale(.8) rotate(-7deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes xp-halo{from{opacity:0;transform:translateX(-50%) scale(.5) rotate(-20deg)}to{opacity:1;transform:translateX(-50%) scale(1) rotate(0)}}
body[data-reduce-motion=true] *,body[data-reduce-motion=true] *::before,body[data-reduce-motion=true] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.cp-screen{width:100%;margin:0}
.cp-screen .cp-heading h1,.rw-heading h1{max-width:100%}
@media(max-width:760px){
 .xp-rhythm-rule{align-items:flex-start;flex-direction:column;gap:5px}
 .xp-review-bar{top:76px;align-items:flex-start;flex-direction:column;gap:7px;padding:9px 16px}.xp-review-bar>div{width:100%}.xp-review-bar button{flex:1}
 .xp-screen h1{font-size:44px}.xp-links{grid-template-columns:1fr}.xp-link-card{min-height:92px;padding:17px}.xp-link-card strong{font-size:16px}
 .xp-purchase-card{grid-template-columns:1fr;padding:16px;gap:15px}.xp-purchase-card>div:first-child h2{font-size:42px}
 .xp-welcome{min-height:330px;padding:26px}.xp-welcome>img{width:66px;height:66px;margin-bottom:20px}.xp-welcome h1{font-size:52px}.xp-orbits{width:260px;height:260px;right:-40px;bottom:-50px}.xp-orbits svg{width:130px;height:130px}
 .xp-tree{display:none}.today-hero{grid-template-columns:1fr}.xp-greeting .eyebrow{font-size:9px}.xp-greeting p:not(.eyebrow){font-size:20px}
 .xp-level-card,.xp-profile-card{padding:22px;gap:15px}.xp-level-card .xp-avatar,.xp-profile-card .xp-avatar{width:68px;height:68px;font-size:22px}.xp-profile-card h2,.xp-level-card h2{font-size:28px}
 .xp-section-title h2{font-size:24px}.xp-section-title button{font-size:11px;padding:8px 11px}
 .xp-modal{padding:34px 20px 24px}.xp-celebration>img{width:175px;height:175px}.xp-modal h2{font-size:32px}
 .xp-tutorial{gap:15px}.xp-tutorial p{font-size:14px}.xp-tutorial-mark{width:74px;height:74px;border-radius:21px}.xp-tutorial-visual{width:78px;height:78px;border-radius:23px}.xp-tutorial-visual svg{width:42px;height:42px}.xp-tutorial-actions button{min-width:0;flex:1}.xp-tutorial-actions>span{display:none}
 .app-header{min-height:76px}.header-actions .offline-badge{display:none}
 .stats .stat{padding:12px 9px}.stats .stat strong{font-size:24px}.stats .stat span{font-size:9px}
 .xp-stats-four{grid-template-columns:repeat(2,minmax(0,1fr))}.xp-scope-label{align-items:flex-start;flex-direction:column;gap:4px}.xp-scope-label span{text-align:left}
 .xp-notification-card{grid-template-columns:42px minmax(0,1fr);gap:12px}.xp-notification-icon{width:42px;height:42px;border-radius:13px}.xp-notification-icon svg{width:24px;height:24px}
 .xp-garden .xp-garden-art{gap:14px;padding:20px}.xp-garden-brand{flex-basis:64px;width:64px;height:64px;border-radius:18px}.xp-garden-course strong{font-size:22px}.xp-garden-art .xp-garden-state{padding:6px 8px;font-size:9px}
 .xp-garden-summary{padding:20px!important}.xp-garden-summary-head{gap:12px}.xp-garden-summary-head h2{font-size:27px}.xp-garden-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.xp-garden-metrics>div:first-child{grid-column:1/-1}.xp-garden-summary-foot{align-items:stretch;flex-direction:column}.xp-garden-summary-foot .primary{width:100%}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}