:root{color-scheme:dark;--bg:#101b18;--paper:#1b2b24;--surface:#20332a;--dark:#15241e;--text:#f5f1dd;--muted:#b1b7a3;--gold:#e6c783;--border:#435046;--bright:#d9b66b;--green:#a7d1ac;--serif:'Noto Serif SC','STZhongsong','SimSun','Songti SC',serif;--sans:'Microsoft YaHei UI','PingFang SC','Microsoft YaHei',sans-serif}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 8% 10%,#25382d 0,transparent 44%),var(--bg);font:15px/1.5 var(--sans);color:var(--text);min-height:100vh}button,a,input,select,textarea{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;color:inherit}button:disabled{opacity:.47;cursor:not-allowed}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #ffe2a0;outline-offset:3px}button{border:1px solid var(--border);background:#29392e;border-radius:4px}button:hover:not(:disabled),a:hover{filter:brightness(1.12)}img{max-width:100%}h1,h2,h3,p{margin:0}h1,h2,h3,.brand strong,.strong-serif{font-family:var(--serif)}h1{font-size:clamp(29px,3.2vw,42px);letter-spacing:.06em;line-height:1.28}h2{font-size:23px;letter-spacing:.04em}h3{font-size:18px}small,.small,.subtle{color:var(--muted);font-size:12px}.muted{color:var(--muted)}
.mast{background:#101a17e8;border-bottom:1px solid #56543b}.mast-inner,.foot,main{max-width:1260px;margin:auto;padding-inline:30px}.mast-inner{min-height:75px;display:flex;align-items:center;gap:36px}.brand{display:flex;align-items:center;gap:10px;white-space:nowrap}.brand img{width:46px;height:46px}.brand span{display:grid}.brand strong{font-size:24px;font-weight:900;letter-spacing:.1em;color:#f2d18e;line-height:1.1}.brand small{font-size:11px;letter-spacing:.34em;margin-top:2px;color:#acb597}.main-nav{display:flex;align-self:stretch;gap:10px;margin:auto}.main-nav a{display:grid;align-content:center;padding:0 22px;border-bottom:2px solid transparent;color:#aebbad;font-size:16px}.main-nav a.active{border-color:var(--gold);color:var(--gold);background:linear-gradient(0deg,#d6c4860e,transparent)}.ghost{background:transparent}.library{padding:8px 15px;color:#e1d8b8}.library:before{content:'▤';margin-right:8px;color:var(--gold)}
main{padding-block:28px 34px;min-height:72vh}.page-head{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:22px}.page-head p{color:var(--muted);margin-top:5px;font-size:13px}.rule-btn{display:flex;align-items:center;gap:14px;padding:9px 13px;background:#192a23;border-color:#60684b;text-align:left}.rule-btn small{display:block;font-size:10px;color:#c9bd8e}.rule-btn b{color:var(--text);font-size:13px}.rule-btn em{font-style:normal;color:var(--gold)}.panel{border:1px solid var(--border);background:linear-gradient(125deg,#23372c,#1b2a24 82%);border-radius:6px;box-shadow:0 3px 10px #07130d25;min-width:0}.inset{padding:21px 23px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:15px}.section-head h2:before{content:'';display:inline-block;width:19px;height:15px;margin-right:8px;background:url('assets/ui/ornament.png') center/contain no-repeat}.pill{font-size:12px;color:#d8c790;border:1px solid #657151;background:#2a382a;padding:2px 8px;border-radius:3px;white-space:nowrap}.text-btn{border:0;background:none;color:var(--gold);padding:4px 0}.action,.secondary,.danger{min-height:40px;padding:8px 17px;font-weight:600}.action{border-color:#d0ac63;color:#1e241e;background:linear-gradient(#e8ce90,#c8a767);box-shadow:inset 0 0 0 2px #ffffff12}.secondary{background:#293b31;color:#e3e3cf;border-color:#607260}.danger{color:#ffc8af;border-color:#896450;background:#412d25}.button-row{display:flex;gap:8px;flex-wrap:wrap}.button-row>*{flex-grow:1}.build-grid{display:grid;grid-template-columns:minmax(280px,.89fr) minmax(380px,1.55fr);gap:18px;align-items:start}.col{display:grid;gap:16px;min-width:0}
.viewer{position:relative;background:#182921;border-color:#746947;overflow:hidden}.viewer-top{padding:16px 20px 10px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(90deg,#202c22,#17271f);border-bottom:1px solid #676347}.viewer-top span{color:#d8bc82;font-size:13px;letter-spacing:.08em}.stage{position:relative;height:308px;isolation:isolate;background-image:linear-gradient(180deg,#0a171015 0%,transparent 65%,#09201755),url('assets/ui/stage.png');background-size:100% 100%;background-position:center;overflow:hidden}.stage:before,.stage:after{content:'';position:absolute;inset:12px;pointer-events:none;border:1px solid #a6a57747;clip-path:polygon(0 0,23px 0,23px 2px,2px 2px,2px 23px,0 23px,0 0,100% 0,100% 23px,calc(100% - 2px) 23px,calc(100% - 2px) 2px,calc(100% - 23px) 2px,calc(100% - 23px) 0,100% 0,100% 100%,calc(100% - 23px) 100%,calc(100% - 23px) calc(100% - 2px),calc(100% - 2px) calc(100% - 2px),calc(100% - 2px) calc(100% - 23px),100% calc(100% - 23px),100% 100%,0 100%,0 calc(100% - 23px),2px calc(100% - 23px),2px calc(100% - 2px),23px calc(100% - 2px),23px 100%,0 100%)}.stage-label{position:absolute;top:18px;left:19px;z-index:2}.stage-label strong{display:block;font:700 32px var(--serif);color:#f5d897;text-shadow:0 2px 3px #151a13}.stage-label small{color:#dde8cf}.actor{position:absolute;inset:8% 13% 9%;width:74%;height:83%;object-fit:contain;filter:drop-shadow(2px 8px 5px #08140bb3)}.portrait-actor{width:124px;height:124px;left:calc(50% - 62px);top:calc(50% - 62px);object-fit:contain;border:1px solid #b59b65;box-shadow:0 0 0 4px #21381f;border-radius:5px;background:#1f3024}.stage-note{position:absolute;bottom:9px;right:14px;color:#b4c0aa;font-size:11px}.current-weapon{margin:0 16px 12px;padding:12px;display:flex;align-items:center;gap:12px;background:#17271f;border:1px solid #4f5a42;border-radius:3px}.item-icon{flex:none;display:grid;place-items:center;width:52px;height:52px;background:linear-gradient(135deg,#263729,#15271f);border:1px solid #998357;border-radius:3px}.item-icon img{width:90%;height:90%;object-fit:contain}.current-weapon b{color:var(--gold);font-size:18px}.current-weapon small{display:block}.metrics{display:grid;grid-template-columns:repeat(3,1fr);margin:0 16px;padding:11px 0 16px;border-top:1px solid #46533e}.metrics>div{text-align:center;border-right:1px solid #495441}.metrics>div:last-child{border:0}.metrics b{display:block;font-size:19px;font-family:Georgia,var(--sans);color:#eddaaa}.metrics small{font-size:11px}.saves{padding:16px}.saves .button-row{margin-top:12px}.jobs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:19px}.job{display:flex;gap:7px;align-items:center;justify-content:center;min-height:54px;background:#1b2921;border:1px solid #465143;padding:6px 3px;color:#c7d0b7}.job img{width:30px;height:30px;object-fit:contain}.job.active{border-color:#c6a35b;color:#f4d994;background:linear-gradient(135deg,#3b4930,#293b28);box-shadow:inset 0 -2px #b09953}.form-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:12px 16px}.field{display:flex;flex-direction:column;gap:6px;min-width:0}.field>span,.field>label{font-size:12px;color:#c0c7ae}input,select,textarea{min-width:0;width:100%;border:1px solid #506047;border-radius:4px;background:#15271e;color:#f4f0d8;padding:9px 10px}select{appearance:auto}textarea{resize:vertical}.step{display:inline-flex;align-items:center;border:1px solid #536149;background:#15271e;border-radius:4px;overflow:hidden}.step button{width:34px;height:36px;border:0;border-radius:0;background:#26382a;color:var(--gold);font-size:19px}.step input,.step output{border:0;text-align:center;flex:1;color:var(--text);min-width:28px;padding:6px 0}.step input::-webkit-inner-spin-button{appearance:none}.wep-note{display:flex;gap:9px;align-items:center;margin-top:14px;padding-top:11px;border-top:1px solid #40513d;color:#c0c4a9;font-size:13px}.wep-note strong{color:var(--gold);margin-right:6px}.qi-list{display:grid;gap:0}.qi-row{display:grid;grid-template-columns:42px minmax(0,1fr) 99px;gap:11px;align-items:center;padding:10px 0;border-top:1px solid #3f503d}.qi-row:first-child{border-top:none;padding-top:0}.qi-row .item-icon{width:40px;height:40px}.qi-row small{display:block;font-size:12px;line-height:1.45}.qi-row b{font-size:15px}.qi-row .step button{height:32px;width:30px}.qi-row.locked{opacity:.65}
.foot{min-height:58px;border-top:1px solid #394a3d;display:flex;align-items:center;gap:15px;color:#9aa997;font-size:12px}.foot button{margin-left:auto;font-size:12px}dialog{color:var(--text);background:#1c2e25;border:1px solid #84774f;border-radius:8px;padding:0;width:min(670px,calc(100vw - 25px));max-height:88dvh;box-shadow:0 20px 90px #0009}dialog::backdrop{background:#07120dd1}#dialog-body{padding:23px}.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}.close{width:34px;height:34px;font-size:22px;background:#20332a}.dialog-actions{display:flex;gap:8px;margin-top:18px;justify-content:flex-end;flex-wrap:wrap}.tabs{display:flex;gap:7px;flex-wrap:wrap;margin:14px 0}.tabs button{min-height:35px;padding:5px 12px}.tabs .on{color:var(--gold);border-color:#ad985d;background:#354530}.rule-table{width:100%;border-collapse:collapse;font-size:13px}.rule-table th{text-align:left;color:#c1c5ac}.rule-table td,.rule-table th{padding:4px}.rule-table td:first-child{white-space:nowrap;color:var(--gold)}.rule-table input,.rule-table select{padding:6px}.info{font-size:13px;color:#c0c9b6;margin:10px 0;line-height:1.65}.note-box{padding:10px 12px;background:#17261f;border-left:2px solid var(--gold);color:#cdd5bd;font-size:13px;margin:10px 0}.dialog-list{display:grid;gap:10px}.saved-card{padding:12px;background:#15271e;border:1px solid var(--border);border-radius:4px}.saved-card b{color:var(--gold)}.saved-card .button-row{margin-top:8px}.saved-card button{flex-grow:0}.short{min-height:30px;padding:4px 10px;font-size:13px}#toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);max-width:90vw;padding:10px 20px;background:#101c16f0;border:1px solid var(--gold);color:#ffe4a2;border-radius:4px;box-shadow:0 2px 14px #0006;opacity:0;transition:opacity .15s;pointer-events:none;z-index:10;text-align:center}#toast.show{opacity:1}
.compare-grid{display:grid;grid-template-columns:1fr 1.45fr;gap:18px}.target-image{height:194px;position:relative;background:linear-gradient(90deg,#13221e15,#172b1fa0),url('assets/ui/stage.png') center 65%/cover;border:1px solid #546145;display:flex;align-items:center;justify-content:space-evenly;border-radius:4px;margin:12px 0}.target-image img{height:85%;width:45%;object-fit:contain}.target-image strong{font:700 24px var(--serif);color:var(--gold)}.target-image small{display:block}.compare-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.compare-card{padding:16px;border:1px solid #657455;border-top:3px solid #adc4a0;background:#1b2a21;border-radius:4px}.compare-card.b{border-top-color:#d4b571}.compare-card h3{color:var(--gold)}.big-number{font:bold 39px Georgia,var(--sans);color:#f0e0af;line-height:1.2;margin:9px 0 1px}.compare-card .bar{height:4px;background:#101d15;margin:16px 0}.bar i{display:block;height:100%;background:#9bb889}.b .bar i{background:#d8b46d}details{margin-top:12px}summary{cursor:pointer;color:var(--gold);font-size:13px}.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.diff{margin:12px 0 16px;border:1px solid #76734b;background:#293a28;padding:12px;color:#ecdda9}.empty{color:#bac4b3;padding:16px 4px}.warn{color:#f5c494}.shares{font:12px/1.5 Consolas,monospace;word-break:break-all}
@media(min-width:1500px){main{padding-top:38px}.stage{height:340px}}
@media(max-width:880px){.mast-inner,.foot,main{padding-inline:17px}.mast-inner{gap:12px}.main-nav{gap:0}.main-nav a{padding:0 13px}.build-grid{grid-template-columns:.9fr 1.35fr;gap:11px}.inset{padding:16px}.jobs{gap:4px}.job{flex-direction:column;gap:0}.stage{height:288px}.form-grid{gap:10px}.compare-grid{grid-template-columns:1fr 1.15fr}.compare-cards{gap:5px}.compare-card{padding:10px}}
@media(max-width:690px){.mast-inner{flex-wrap:wrap;gap:0;padding-top:9px;min-height:0}.brand img{width:33px;height:33px}.brand strong{font-size:20px}.brand small{font-size:9px}.library{margin-left:auto;font-size:12px;padding:6px 9px}.main-nav{order:3;width:100%;margin-top:8px;justify-content:space-between}.main-nav a{flex:1;min-width:0;text-align:center;padding:10px 2px;font-size:14px}.mast-inner,.foot,main{padding-inline:12px}main{padding-block:18px}.page-head{gap:8px;margin-bottom:13px}.page-head p{display:none}.rule-btn{gap:8px;padding:6px 8px}.rule-btn b{font-size:12px}.build-grid,.compare-grid{grid-template-columns:1fr}.build-grid{display:flex;flex-direction:column}.col{display:contents}.viewer{order:0;width:100%}.build-config{order:1;width:100%}.qi-panel{order:2;width:100%}.saves{order:3;width:100%}.viewer-top{padding:9px 12px}.viewer-top h2{font-size:19px}.stage{height:216px}.stage-label strong{font-size:26px}.current-weapon{padding:7px 10px;margin:0 10px 6px}.current-weapon .item-icon{width:36px;height:36px}.current-weapon b{font-size:16px}.metrics{margin-inline:10px;padding:7px 0 9px}.metrics b{font-size:17px}.current-weapon small{font-size:11px}.job{flex-direction:row;gap:3px;min-height:42px;font-size:13px}.job img{width:22px;height:22px}.jobs{margin-bottom:13px}.inset{padding:14px}.section-head{margin-bottom:10px}h2{font-size:21px}.compare-card{padding:12px}.compare-grid .col{display:grid}.foot{gap:8px}.foot button{padding:5px 0}#dialog-body{padding:15px}.rule-table td,.rule-table th{padding:3px 2px}.rule-table input,.rule-table select{padding:5px 3px}.panel{border-radius:4px}}
.slot-summary{display:grid;gap:7px}.slot-summary>div{display:flex;align-items:center;gap:9px;font-size:13px;color:#d6ddc8}.slot-summary b{display:grid;place-items:center;background:#314537;color:#e2c78b;border:1px solid #687457;width:22px;height:22px;font:600 13px Georgia,serif;border-radius:3px}.gem-details{border-top:1px solid #40513d;padding-top:9px}.gem-details summary{display:list-item;font-size:14px}.gem-details summary span{font-size:12px;color:#a8b6a1;margin-left:8px}.gem-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0 6px}.qi-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px}.qi-foot button{white-space:nowrap;font-size:13px}.share-outline{display:flex;align-items:center;gap:12px;background:#16271e;border:1px solid #52634b;padding:10px}.share-outline img{width:52px;height:52px;object-fit:contain}.share-outline small{display:block}.share-status{color:#ecd399;font-size:13px;margin-top:8px}.saved-card p{margin-top:5px}.stage-label{pointer-events:none}.stage-label small{display:inline-block;padding:1px 4px;background:#142019aa;border-radius:2px}.gem-grid select{padding-inline:3px}.job img{border-radius:3px}.fg-art-head span{font-family:var(--sans)}
.stage{background-image:radial-gradient(ellipse at 50% 42%,#ddcd8e25 0%,#b6bf9312 32%,transparent 67%),url('assets/ui/stage.png')}.portrait-actor{width:94px;height:94px;left:calc(50% - 47px);top:calc(50% - 47px);padding:4px;background:linear-gradient(135deg,#3c4832,#1b3024);box-shadow:0 0 0 3px #1d3023,0 0 0 4px #7c8054,0 8px 24px #0e1e16}
.wep-note{flex-wrap:wrap}.stone-link{margin-left:auto;font-size:13px;white-space:nowrap}@media(max-width:460px){.wep-note{gap:5px 8px}.stone-link{margin-left:0}.wep-note span{flex:1}.wep-note .stone-link{width:100%;text-align:left}}
.gem-socket,.compare-gem-side{min-width:0;display:grid;gap:7px;padding:9px;border:1px solid #44583f;background:#16281f;border-radius:4px}
.gem-grid select,.gem-grid input{width:100%;font-size:13px}
.gem-input span{font-size:11px}.gem-input input::placeholder,.compare-gem-side input::placeholder{color:#a5b29e;opacity:1}
.compare-gem-sides{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}
@media(max-width:1000px){.gem-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.qi-summary{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-size:13px;margin:-4px 0 12px}
.qi-summary button{white-space:nowrap}.qi-level{font:11px var(--sans);color:#c2bd99}.qi-row .qi-effect{color:#c8cca9;margin-top:2px}.qi-row .step input{width:32px;appearance:textfield;font-variant-numeric:tabular-nums}
.qi-in-damage{display:inline-block;font:10px var(--sans);color:#bcd8a7;padding:1px 4px;border:1px solid #576d4d;border-radius:2px;margin-left:5px;vertical-align:2px}
.skill-field-label{display:flex;align-items:baseline;justify-content:space-between;gap:6px;color:var(--muted);font-size:13px}
.skill-field-label button{padding:0;white-space:nowrap;font-size:12px}
.skillbook-tools{display:grid;grid-template-columns:minmax(0,1fr) minmax(95px,30%);gap:12px}
.book-count{color:var(--muted);font-size:12px;margin:10px 0}
.skillbook-list{max-height:min(58vh,520px);overflow-y:auto;overscroll-behavior:contain;padding-right:5px;scrollbar-color:#69795d #18281f}
.book-skill{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:11px;align-items:start;border-top:1px solid var(--border);padding:11px 0}
.book-skill img{width:40px;height:40px;object-fit:contain;border:1px solid #59624d;border-radius:3px}
.book-skill h3{font-size:16px}.book-skill h3 small{font:12px var(--sans);color:var(--gold);white-space:nowrap}
.book-skill p{font-size:12px;color:#d1d6bf;margin-top:3px}.book-skill .book-extra{color:var(--gold)}
.book-choose{align-self:center;text-align:right}.book-choose .text-btn{padding-inline:4px;font-size:13px}
@media(max-width:460px){.book-skill{grid-template-columns:32px minmax(0,1fr) auto;gap:6px}.book-skill img{width:32px;height:32px}.book-choose small{font-size:10px}}

.viewer-top .stage-label{position:static}
.viewer-top h2{color:var(--gold)}
.viewer .jobs{grid-column:1/-1;grid-row:1;gap:4px;margin:0;padding:6px;background:#16271f;border-bottom:1px solid #546046}
.viewer .job{gap:4px;min-height:41px;font-size:13px;padding:4px 1px}
.viewer .job img{width:23px;height:23px}
.socket-tools{position:relative;margin-top:14px;border-top:1px solid #40513d}
.socket-tools .gem-details{padding:0;margin:0;border:0}
.socket-tools summary{min-height:40px;align-content:center;padding:9px 105px 3px 0;width:fit-content}
.socket-tools .stone-link{position:absolute;right:0;top:2px;min-height:38px;font-size:13px}
.build-actions .action{flex:2}
.level-undo:not([hidden]){display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 10px;margin-top:11px;border-left:2px solid var(--gold);background:#18271e;color:#ded8ae;font-size:13px}
.level-undo .text-btn{flex:none}
@media(min-width:691px) and (max-width:960px){
 .saves{display:flex;flex-direction:column;padding:12px}
 .saves .section-head{margin-bottom:8px}
 .saves .build-actions{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:4px;margin:0 0 10px}
 .saves .slot-summary{order:1}
 .build-actions button{white-space:nowrap;padding-inline:3px;font-size:13px}
}
@media(min-width:691px){
 .build-grid .stage{height:clamp(190px,24vh,276px)}
 .build-grid .viewer-top{padding-block:10px}
 .build-grid .current-weapon{margin:8px 13px;padding:8px 10px}
 .build-grid .metrics{padding:7px 0 10px}
}
@media(min-width:900px) and (min-height:780px){
 .build-grid>.col:first-child{position:sticky;top:12px}
}
@media(max-width:690px){
 .build-grid .viewer{display:grid;grid-template-columns:clamp(88px,28vw,136px) minmax(0,1fr);grid-template-rows:auto auto 1fr auto}
 .build-grid .stage{grid-column:1;grid-row:2/5;min-height:150px;height:auto;border-right:1px solid #596046}
 .build-grid .actor{inset:5% 2%;width:96%;height:90%}
 .build-grid .stage::before,.build-grid .stage::after{inset:5px}
 .build-grid .viewer-top,.build-grid .current-weapon,.build-grid .metrics{grid-column:2}
 .build-grid .viewer-top{grid-row:2;padding:5px 11px;background:transparent;border:0}
 .build-grid .viewer-top h2{font-size:21px}
 .build-grid .current-weapon{grid-row:3;align-self:center;gap:8px;margin:0 10px;padding:4px 0 7px;border:0;border-radius:0;background:transparent}
 .build-grid .current-weapon b{font-size:15px}
 .build-grid .current-weapon .item-icon{width:34px;height:34px}
 .build-grid .metrics{grid-row:4;grid-template-columns:1.18fr 1fr .85fr;margin:0;padding:6px 4px}
 .build-grid .metrics b{font-size:15px;line-height:1.3;overflow-wrap:anywhere}
 .build-grid .metrics small{display:block;font-size:10px;line-height:1.35}
 .build-grid .saves{order:3}
 .build-grid .qi-panel{order:2}
 .saves .build-actions{position:fixed;z-index:5;bottom:0;left:0;right:0;display:grid;grid-template-columns:1fr 1fr 1.55fr;gap:7px;margin:0;padding:8px max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:#14241dee;border-top:1px solid #736c4f;box-shadow:0 -4px 14px #07140e59}
 .build-actions button{min-height:42px;padding-inline:7px}
 body:has(.build-grid){padding-bottom:calc(60px + env(safe-area-inset-bottom))}
 html:has(.build-grid){scroll-padding-bottom:calc(68px + env(safe-area-inset-bottom))}
 body:has(.build-grid) #toast{bottom:calc(70px + env(safe-area-inset-bottom))}
}
@media(max-width:370px){
 .job{flex-direction:column;gap:1px;line-height:1.3}
 .build-config .form-grid{grid-template-columns:minmax(96px,.85fr) minmax(0,1.3fr)}
 .qi-row{grid-template-columns:30px minmax(0,1fr) 87px;gap:6px}
 .qi-row .item-icon{width:30px;height:30px}
 .qi-row .step button{width:27px}
}
.share-preview {
 padding: 12px 14px;
 margin: 10px 0;
 border: 1px solid var(--border);
 border-radius: 4px;
 background: #15271e;
 color: var(--text);
 font: 14px/1.55 var(--sans);
}
.share-preview p {margin: 0}
.share-preview p + p {margin-top: .8em}
.share-preview p > span {display: block}
.share-preview p > span + span {margin-top: .2em}
.share-preview strong {color: var(--gold)}
.share-preview-url {overflow-wrap: anywhere; max-height: 3.2em; overflow: auto}