:root{
  --sight-ink:#18251f;
  --sight-forest:#123f31;
  --sight-jade:#2c7358;
  --sight-mint:#dcebe1;
  --sight-paper:#f6f2e8;
  --sight-warm:#eee6d6;
  --sight-gold:#b6873d;
  --sight-line:rgba(24,37,31,.15);
  --sight-shadow:0 24px 70px rgba(28,50,40,.13);
}
.sight-page{min-height:100vh;background:var(--sight-paper);color:var(--sight-ink);font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif}
.sight-shell{min-height:100vh;background-image:radial-gradient(circle at 84% 13%,rgba(44,115,88,.11),transparent 28%),linear-gradient(90deg,rgba(18,63,49,.026) 1px,transparent 1px),linear-gradient(rgba(18,63,49,.026) 1px,transparent 1px);background-size:auto,38px 38px,38px 38px}
.sight-head{height:86px;padding:0 clamp(18px,4vw,64px);display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--sight-line);background:rgba(246,242,232,.88);backdrop-filter:blur(16px);position:sticky;top:0;z-index:40}
.sight-icon-button,.sight-text-button{border:1px solid var(--sight-line);background:transparent;color:var(--sight-forest);border-radius:999px;min-height:42px;padding:0 17px;cursor:pointer}
.sight-icon-button{font-size:22px;width:44px;padding:0}
.sight-brand{margin-right:auto}.sight-brand span,.sight-eyebrow{display:block;font-size:10px;line-height:1.3;letter-spacing:.19em;font-weight:800;color:var(--sight-jade);text-transform:uppercase}
.sight-brand h1{margin:2px 0 0;font-family:Georgia,"Noto Serif SC",serif;font-size:22px;font-weight:600}
.sight-head-actions{display:flex;gap:9px}
.sight-main{width:min(1440px,100%);margin:auto;padding:clamp(22px,4vw,58px)}
.sight-welcome{min-height:calc(100vh - 204px);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);align-items:center;gap:clamp(30px,7vw,100px)}
.sight-welcome-copy h2{font-family:Georgia,"Noto Serif SC",serif;font-size:clamp(40px,6vw,78px);line-height:1.06;letter-spacing:-.035em;margin:22px 0}
.sight-welcome-copy>p{max-width:650px;font-size:17px;line-height:1.85;color:#53615a}
.sight-import-actions{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:12px;margin:32px 0 16px}
.sight-primary,.sight-secondary,.sight-danger{border:0;border-radius:12px;padding:12px 18px;min-height:44px;font-weight:750;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.sight-primary{background:var(--sight-forest);color:#fff;box-shadow:0 10px 30px rgba(18,63,49,.2)}
.sight-primary:hover{background:#19513f;transform:translateY(-1px)}
.sight-secondary{background:#fffdf8;color:var(--sight-forest);border:1px solid var(--sight-line)}
.sight-danger{background:#f9e3df;color:#8a2d25}
.sight-primary.wide,.sight-secondary.wide{width:100%;margin-top:10px}
.sight-import-actions button{text-align:left;padding:18px}.sight-import-actions span{display:block;font-size:16px}.sight-import-actions small{display:block;margin-top:5px;font-weight:500;opacity:.7}
.sight-privacy{font-size:12px!important;color:#708078!important}
.sight-hero-score{position:relative;display:grid;place-items:center;min-height:500px}
.sight-score-paper{width:min(440px,90%);aspect-ratio:.75;background:#fffef9;border:1px solid rgba(28,50,40,.11);box-shadow:var(--sight-shadow);transform:rotate(2.5deg);position:relative;padding-top:38%;overflow:hidden}
.sight-score-paper:before,.sight-score-paper:after{content:"";position:absolute;left:10%;right:10%;height:1px;background:#26362e;box-shadow:0 8px #26362e,0 16px #26362e,0 24px #26362e,0 32px #26362e}
.sight-score-paper:before{top:37%}.sight-score-paper:after{top:65%}
.sight-score-paper>i{position:absolute;width:9px;height:9px;background:var(--sight-jade);border-radius:50%;top:37%;left:25%;box-shadow:80px 8px var(--sight-jade),160px 24px var(--sight-jade),235px 0 var(--sight-jade)}
.sight-score-paper .note{position:absolute;font:46px Georgia;color:var(--sight-forest)}.sight-score-paper .n1{left:18%;top:31%}.sight-score-paper .n2{left:49%;top:58%}.sight-score-paper .n3{right:14%;top:30%}
.sight-hero-score>span{position:absolute;right:2%;bottom:10%;writing-mode:vertical-rl;letter-spacing:.18em;color:var(--sight-jade);font-size:11px;font-weight:800}
.sight-steps{display:flex;gap:0;margin-bottom:28px;border:1px solid var(--sight-line);border-radius:16px;overflow:hidden;background:#fffaf1}
.sight-steps button{flex:1;border:0;border-right:1px solid var(--sight-line);background:transparent;padding:14px;display:flex;justify-content:center;align-items:center;gap:10px;color:#68756e;cursor:pointer}.sight-steps button:last-child{border-right:0}.sight-steps button.active{background:var(--sight-forest);color:white}.sight-steps button i{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1px solid currentColor;font-style:normal;font-size:12px}
.sight-panel,.sight-history{background:rgba(255,253,248,.82);border:1px solid var(--sight-line);border-radius:22px;box-shadow:0 20px 60px rgba(39,58,49,.08);padding:clamp(18px,3vw,36px)}
.sight-panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:24px}.sight-panel-heading h2{font:600 clamp(25px,3vw,38px)/1.15 Georgia,"Noto Serif SC",serif;margin:8px 0 0}
.sight-file-meta{color:#68756e;font-size:13px;text-align:right;max-width:42%}
.sight-prepare-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(270px,.65fr);gap:22px}
.sight-source-card,.sight-scan-card,.sight-reference-pane,.sight-result-pane,.sight-player-card,.sight-session-card{background:#fffdf8;border:1px solid var(--sight-line);border-radius:16px;overflow:hidden}
.sight-canvas-wrap{min-height:480px;display:grid;place-items:center;background:#d9ddd8;padding:18px;overflow:auto}.sight-canvas-wrap canvas{max-width:100%;max-height:68vh;background:#fff;box-shadow:0 15px 45px rgba(0,0,0,.13)}.sight-empty-canvas{color:#65726b}
.sight-image-tools{padding:13px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.sight-image-tools button{border:1px solid var(--sight-line);background:#fff;border-radius:9px;padding:8px 11px}.sight-image-tools label{display:flex;align-items:center;gap:7px;font-size:12px}
.sight-scan-card{padding:24px;align-self:start}.sight-scan-card h3,.sight-session-card h3{font:600 25px Georgia,"Noto Serif SC",serif;margin:12px 0}.sight-scan-card p{color:#68756e;line-height:1.7}
.sight-engine-checks{border-top:1px solid var(--sight-line);border-bottom:1px solid var(--sight-line);margin:18px 0;padding:10px 0}.sight-engine-checks div{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:9px;padding:8px 0;font-size:12px}.sight-engine-checks i{width:8px;height:8px;border-radius:50%;background:#b7a26e}.sight-engine-checks i.ok{background:#318661}.sight-engine-checks i.bad{background:#bf5b4e}
.sight-status{min-height:20px;color:#6e5b35;font-size:12px;line-height:1.6}
.sight-review-actions{display:flex;gap:10px}.sight-review-rule{padding:13px 15px;background:#fff5d8;border-left:3px solid var(--sight-gold);font-size:13px;color:#65532f}
.sight-review-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px;min-height:560px}.sight-pane-title{height:52px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--sight-line)}.sight-pane-title span{font-size:12px;color:#718078}
.sight-reference-scroll{height:530px;overflow:auto;background:#dde0dc;padding:16px;text-align:center}.sight-reference-scroll img{max-width:100%;background:#fff;box-shadow:0 8px 25px rgba(0,0,0,.15)}
.sight-note-list{height:530px;overflow:auto;padding:12px}.sight-no-notes{padding:70px 28px;text-align:center;color:#7a8780}
.sight-note-item{display:grid;grid-template-columns:52px 1fr auto auto;gap:12px;align-items:center;padding:13px;border:1px solid var(--sight-line);border-radius:12px;margin-bottom:9px;background:white;cursor:pointer}.sight-note-item:hover{border-color:var(--sight-jade)}.sight-note-item.low{background:#fff8df;border-color:#d6b761}.sight-note-measure{font-size:10px;color:#79877f}.sight-note-value{font:600 19px Georgia,serif}.sight-note-duration{font-size:12px;color:#65736b}.sight-confidence{font-size:11px;padding:5px 8px;border-radius:999px;background:var(--sight-mint);color:var(--sight-forest)}.sight-note-item.low .sight-confidence{background:#f3df9c;color:#654f12}
.sight-note-item.rest{border-left:4px solid var(--sight-gold)}.sight-note-item.rest .sight-note-value{color:#815f25;font-size:28px}
.sight-confirmed-badge{background:var(--sight-mint);color:var(--sight-forest);border-radius:999px;padding:8px 13px;font-size:12px;font-weight:800}
.sight-practice-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(270px,.65fr);gap:18px}.sight-player-card{padding:24px}.sight-now-playing{display:grid;grid-template-columns:1fr auto;gap:4px;border-bottom:1px solid var(--sight-line);padding-bottom:20px}.sight-now-playing small{grid-column:1/-1;letter-spacing:.16em;color:var(--sight-jade)}.sight-now-playing strong{font:600 clamp(28px,4vw,50px) Georgia,serif}.sight-now-playing span{align-self:end;color:#6e7a73}
.sight-practice-score-shell{margin-top:18px;border:1px solid var(--sight-line);border-radius:15px;background:#e7eae5;overflow:hidden}.sight-score-toolbar{display:flex;align-items:center;gap:16px;padding:12px 14px;background:#fffdf8;border-bottom:1px solid var(--sight-line)}.sight-score-toolbar>div{margin-right:auto}.sight-score-toolbar b{display:block;color:var(--sight-forest)}.sight-score-toolbar small{display:block;margin-top:3px;color:#728078}.sight-score-toolbar label{display:flex;align-items:center;gap:7px;font-size:11px;color:#65736b}.sight-score-toolbar select{border:1px solid var(--sight-line);border-radius:8px;padding:6px;background:white}.sight-practice-score-stage{height:clamp(390px,58vh,720px);overflow:auto;padding:22px;scrollbar-color:var(--sight-jade) transparent}.sight-practice-score-sheet{position:relative;width:145%;min-width:760px;margin:auto;line-height:0;transition:width .18s ease}.sight-practice-score-sheet img{display:block;width:100%;height:auto;background:white;box-shadow:0 18px 45px rgba(17,42,32,.18)}.sight-practice-measure-band{display:none;position:absolute;z-index:2;border:2px solid rgba(182,135,61,.72);background:linear-gradient(90deg,rgba(217,177,89,.08),rgba(217,177,89,.19),rgba(217,177,89,.08));border-radius:12px;pointer-events:none;transition:left .22s ease,top .22s ease}.sight-practice-measure-band.active{display:block}.sight-follow-orb{display:none;position:absolute;z-index:3;width:26px;height:26px;transform:translate(-50%,-50%);border-radius:50%;background:#f5d47c;border:4px solid #fff;box-shadow:0 0 0 5px rgba(44,115,88,.2),0 5px 18px rgba(18,63,49,.5);pointer-events:none;transition:left .22s cubic-bezier(.2,.8,.2,1),top .22s cubic-bezier(.2,.8,.2,1)}.sight-follow-orb.active{display:block;animation:sightOrbPulse .7s ease-in-out infinite alternate}.sight-follow-orb i{position:absolute;left:50%;top:100%;width:2px;height:32px;background:linear-gradient(var(--sight-jade),transparent)}.sight-follow-orb.resting{background:#fff;border-color:var(--sight-gold);box-shadow:0 0 0 5px rgba(182,135,61,.22),0 5px 18px rgba(93,64,15,.4)}.sight-follow-help{margin:0;padding:9px 14px;background:#fffdf8;color:#748078;font-size:11px;line-height:1.55}@keyframes sightOrbPulse{to{transform:translate(-50%,-50%) scale(1.16);box-shadow:0 0 0 9px rgba(44,115,88,.12),0 7px 20px rgba(18,63,49,.45)}}
.sight-player-controls{display:flex;align-items:end;gap:12px;flex-wrap:wrap;padding:22px 0}.sight-player-controls label,.sight-session-card label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#637068}.sight-player-controls input,.sight-player-controls select,.sight-session-card input{border:1px solid var(--sight-line);background:white;border-radius:9px;padding:9px;min-width:84px}.sight-play-button{width:64px;height:64px;border-radius:50%;border:0;background:var(--sight-forest);color:white;font-size:24px;cursor:pointer}
.sight-practice-timeline{display:flex;gap:8px;overflow:auto;padding:12px 2px}.sight-timeline-note{min-width:70px;padding:12px 8px;border:1px solid var(--sight-line);border-radius:10px;text-align:center;background:#fff}.sight-timeline-note.rest{border-color:#cfac68;background:#fff9e9}.sight-timeline-note.active{background:var(--sight-forest);color:white}.sight-timeline-note.rest.active{background:#8a6525;color:white}.sight-timeline-note small{display:block;opacity:.65}
.sight-session-card{padding:24px;align-self:start}.sight-session-card label{margin-top:14px}.sight-session-card input{font-size:14px}
.sight-history-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}.sight-history-card{background:#fff;border:1px solid var(--sight-line);border-radius:14px;padding:17px}.sight-history-card h3{margin:7px 0}.sight-history-card p{color:#6c7972;font-size:12px}.sight-history-card footer{display:flex;gap:8px;margin-top:14px}.sight-history-empty{text-align:center;padding:70px;color:#75827b}
.sight-admin-mark{display:block;margin:16px auto 0;border:0;background:transparent;color:rgba(24,37,31,.34);font-size:9px;letter-spacing:.13em;padding:8px;cursor:default}
.sight-dialog{width:min(660px,calc(100% - 28px));border:0;border-radius:18px;padding:0;box-shadow:0 30px 100px rgba(0,0,0,.28);color:var(--sight-ink)}.sight-dialog::backdrop{background:rgba(12,30,23,.64);backdrop-filter:blur(4px)}.sight-dialog form{padding:24px}.sight-dialog header,.sight-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.sight-dialog header{border-bottom:1px solid var(--sight-line);padding-bottom:15px}.sight-dialog header h2{margin:5px 0;font:600 26px Georgia,serif}.sight-dialog header button{border:0;background:transparent;font-size:26px}.sight-dialog footer{border-top:1px solid var(--sight-line);padding-top:16px;margin-top:18px}.sight-dialog footer button:not(.sight-primary):not(.sight-danger){border:1px solid var(--sight-line);background:white;border-radius:10px;padding:10px 16px}
.sight-dialog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:18px}.sight-dialog-grid label,.sight-access-dialog label{display:flex;flex-direction:column;gap:6px;font-size:12px}.sight-dialog-grid input,.sight-dialog-grid select,.sight-access-dialog input{padding:10px;border:1px solid var(--sight-line);border-radius:9px;background:#fff}.sight-dialog-options{display:flex;gap:15px;flex-wrap:wrap;margin-top:18px;font-size:13px}
.ai-dashboard-feature{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(125deg,#123f31,#245e49)!important;color:white}.ai-dashboard-feature .edu-card-label{color:#bcdccb}.ai-dashboard-feature h2{font:600 30px Georgia,"Noto Serif SC",serif;margin:8px 0}.ai-dashboard-feature p{color:#d9e7df}.ai-dashboard-feature .edu-button.primary{background:#f2dfb6;color:#18392d}
.tool-card.ai-tool-card{background:linear-gradient(140deg,#123f31,#2c7358);color:white;border-color:transparent}.tool-card.ai-tool-card .muted{color:#d4e4dc}.tool-card.pro-locked{opacity:.68;filter:saturate(.6)}
body.admin-mode .tool-card.pro-locked{opacity:1;filter:none}.hidden{display:none!important}
@media(max-width:900px){
  .sight-welcome{grid-template-columns:1fr;min-height:auto}.sight-hero-score{min-height:350px;order:-1}.sight-score-paper{width:270px}.sight-import-actions{grid-template-columns:1fr 1fr}.sight-import-actions .sight-primary{grid-column:1/-1}.sight-prepare-grid,.sight-review-grid,.sight-practice-grid{grid-template-columns:1fr}.sight-review-grid{min-height:0}.sight-reference-scroll,.sight-note-list{height:420px}.sight-score-toolbar{align-items:flex-end;flex-wrap:wrap}.sight-score-toolbar>div{width:100%}.sight-practice-score-stage{height:55vh}.ai-dashboard-feature{align-items:flex-start;flex-direction:column}
}
@media(max-width:600px){
  .sight-head{height:68px;padding:0 12px}.sight-brand span{display:none}.sight-brand h1{font-size:18px}.sight-head-actions{gap:4px}.sight-text-button{min-height:38px;padding:0 10px;font-size:12px}.sight-main{padding:14px}.sight-welcome{display:flex;flex-direction:column;gap:12px}.sight-hero-score{min-height:240px;width:100%;order:0}.sight-welcome-copy h2{font-size:38px;margin:14px 0}.sight-welcome-copy>p{font-size:14px}.sight-import-actions{grid-template-columns:1fr;margin-top:22px}.sight-import-actions .sight-primary{grid-column:auto}.sight-score-paper{width:190px}.sight-steps button{padding:10px 4px;font-size:11px}.sight-steps button i{display:none}.sight-panel{padding:14px;border-radius:14px}.sight-panel-heading{flex-direction:column}.sight-file-meta{max-width:none;text-align:left}.sight-canvas-wrap{min-height:310px}.sight-review-actions{width:100%;flex-wrap:wrap}.sight-review-actions button{flex:1;padding:10px;min-width:120px}.sight-reference-scroll,.sight-note-list{height:350px}.sight-note-item{grid-template-columns:42px 1fr auto;gap:8px}.sight-note-duration{display:none}.sight-player-card,.sight-session-card{padding:16px}.sight-practice-score-stage{height:62vh;padding:10px}.sight-practice-score-sheet{min-width:680px}.sight-dialog-grid{grid-template-columns:1fr 1fr}
}
@media(orientation:landscape) and (max-height:520px){
  .sight-head{position:static;height:58px}.sight-main{padding:12px}.sight-welcome{grid-template-columns:1.2fr .8fr;min-height:auto}.sight-hero-score{min-height:300px;order:0}.sight-welcome-copy h2{font-size:36px}.sight-import-actions{margin:15px 0;grid-template-columns:repeat(3,1fr)}.sight-import-actions .sight-primary{grid-column:auto}.sight-canvas-wrap{min-height:300px;max-height:65vh}
}
@media(prefers-reduced-motion:reduce){.sight-page *{scroll-behavior:auto!important;transition:none!important}.sight-follow-orb.active{animation:none!important}}

/* V1.15 image editing, exact score follow and WebView touch refinements */
.sight-canvas-wrap{position:relative}
.sight-canvas-wrap.cropping canvas{cursor:crosshair;touch-action:none}
.sight-crop-overlay{position:absolute;z-index:5;border:2px solid #f0bd4c;background:rgba(240,189,76,.14);box-shadow:0 0 0 9999px rgba(12,29,23,.42);pointer-events:none}
.sight-canvas-wrap.cropping:after{content:"拖动框选要识别的谱面区域";position:sticky;z-index:6;left:12px;bottom:12px;align-self:end;justify-self:center;padding:7px 11px;border-radius:999px;background:#173f31;color:#fff;font-size:11px;pointer-events:none}
.sight-reference-stage{position:relative;display:inline-block;min-width:70%;line-height:0;cursor:default}
.sight-reference-stage.locating{cursor:crosshair;outline:4px solid rgba(44,115,88,.28)}
.sight-reference-stage img{display:block;max-width:100%}
.sight-review-pin{position:absolute;z-index:3;width:22px;height:22px;transform:translate(-50%,-50%);border:3px solid #fff;border-radius:50%;background:#e8b94e;box-shadow:0 0 0 5px rgba(44,115,88,.22),0 5px 16px rgba(0,0,0,.34);pointer-events:none}
.sight-practice-measure-band{border-color:rgba(182,135,61,.55);background:linear-gradient(90deg,rgba(217,177,89,.04),rgba(217,177,89,.11),rgba(217,177,89,.04));transition:left .16s ease,top .16s ease}
.sight-follow-orb{width:18px;height:18px;background:rgba(255,247,187,.42);border:2px solid rgba(255,255,255,.94);box-shadow:0 0 5px 3px #f4d269,0 0 17px 10px rgba(44,115,88,.58),0 0 32px 16px rgba(246,207,93,.34);mix-blend-mode:multiply;transition:left .14s linear,top .14s linear}
.sight-follow-orb i{display:none}
.sight-follow-orb.resting{background:rgba(255,255,255,.8);border-color:var(--sight-gold);box-shadow:0 0 0 4px rgba(182,135,61,.24),0 0 18px 8px rgba(182,135,61,.35)}
.sight-player-controls .sight-check{flex-direction:row;align-items:center;min-height:42px;padding:8px 10px;border:1px solid var(--sight-line);border-radius:10px;background:#fff}
.sight-player-controls .sight-check input{min-width:0;accent-color:var(--sight-jade)}
.sight-dialog footer{flex-wrap:wrap}